CARA MEMBUAT EFEK BERGOYANG PADA GAMBAR ARTIKEL TEMPLATE BLOGGER CARA MEMBUAT EFEK BERGOYANG PADA GAMBAR ARTIKEL TEMPLATE BLOGGER - SUARA HARIAN OTO BEMO BERODA TIGA
Suara Harian Oto Bemo Beroda Tiga

Komunikasi, Media Ilmu & Pengetahuan Umum Blogging

Langsung ke konten utama

"OTO BEMO.. OTO BEMO.. BERODA TIGA .. TEMPAT BERHENTI.. DITENGAH TENGAH KOTA..PANGGIL NONA..PANGGIL NONA..NAIK KERETA..NONA BILANG..TIDAK PUNYA UANG.. JALAN KAKI SAJA"

CARA MEMBUAT EFEK BERGOYANG PADA GAMBAR ARTIKEL TEMPLATE BLOGGER

Gambar
🔓Owner Post Published 🕕
HOME GOOGLE CARA MEMBUAT EFEK BERGOYANG PADA GAMBAR ARTIKEL TEMPLATE BLOGGER
Sebelumnya anda mungkin mengalami menghidupkan lilin dimalam hari dalam keadaan gelap gulita, tampaklah api lilin tersebut bergoyang ditiup oleh angin itu sebagai gambaran api bergoyang adalah efek angin tak bisa membaca. Nah kali ini saya akan membuat pengaruh shake atau pengaruh bergoyang yang di implementasikan didalam gambar kiriman blogspot tanpa ada komplemen mark up apapun dan hanya menggunakan pengaruh murni CSS3 yang tidak akan terlalu kuat terhadap beban loading blog anda.

Efek ini akan bekerja pada saat pengunjung melakukan mouse over atau melakukan hover baik itu terhadap gambar yang mempunyai anchor link maupun gambar yang tidak memilikinya. Efek shake yang membuat gambar blog anda bergoyang ini akan bekerja pada semua browser mirip IE, Firefox, Chrome, Safari, Opera bahkan saya telah mencoba melakukan hover pada browser di perangkat android dan pengaruh inipun bekerja sangat mulus tanpa ada kendala.
 
Sebelumnya anda mungkin sudah mencoba memasang  Cara Menciptakan Efek Bergoyang Pada Gambar Posting Blog.
Langkah-langkah membuat pengaruh bergoyang pada gambar di blog:
1) Masuk ke dashboard blog anda
2) Klik Template control F
3) Klik edit tempalte kemudian cari aba-aba ]]></b:skin>
4) Salin kemudian pastekan semua scrift css dibawah ini tepat diatas aba-aba tersebut
Klik ganda untuk menyalin
 

.entry-content img {  transition-duration:0.5s;  transition-timing-function: ease;  transition-delay:0s;  -moz-transition-duration:0.5s;  -moz-transition-timing-function:ease;  -moz-transition-delay:0s;   -webkit-transition-duration:0.5s;  -webkit-transition-timing-function:ease;  -webkit-transition-delay:0s;  -o-transition-duration:0.5s;  -o-transition-timing-function:ease;  -o-transition-delay:0s;  }  .entry-content img:hover {  animation-name: goyang;  animation-duration: 0.8s;  transform-origin:50% 50%;  animation-iteration-count: infinite;  animation-timing-function: linear;  -moz-animation-name: goyang;  -moz-animation-duration: 0.8s;  -moz-transform-origin:50% 50%;  -moz-animation-iteration-count: infinite;  -moz-animation-timing-function: linear;  -webkit-animation-name: goyang;  -webkit-animation-duration: 0.8s;  -webkit-transform-origin:50% 50%;  -webkit-animation-iteration-count: infinite;  -webkit-animation-timing-function: linear;  }  @keyframes goyang{  0% { transform: translate(2px, 1px) rotate(0deg); }  10% { transform: translate(-1px, -2px) rotate(-1deg); }  20% { transform: translate(-3px, 0px) rotate(1deg); }  30% { transform: translate(0px, 2px) rotate(0deg); }  40% { transform: translate(1px, -1px) rotate(1deg); }  50% { transform: translate(-1px, 2px) rotate(-1deg); }  60% { transform: translate(-3px, 1px) rotate(0deg); }  70% { transform: translate(2px, 1px) rotate(-1deg); }  80% { transform: translate(-1px, -1px) rotate(1deg); }  90% { transform: translate(2px, 2px) rotate(0deg); }  100% { transform: translate(1px, -2px) rotate(-1deg); }  }  @-moz-keyframes goyang{  0% { -moz-transform: translate(2px, 1px) rotate(0deg); }  10% { -moz-transform: translate(-1px, -2px) rotate(-1deg); }  20% { -moz-transform: translate(-3px, 0px) rotate(1deg); }  30% { -moz-transform: translate(0px, 2px) rotate(0deg); }  40% { -moz-transform: translate(1px, -1px) rotate(1deg); }  50% { -moz-transform: translate(-1px, 2px) rotate(-1deg); }  60% { -moz-transform: translate(-3px, 1px) rotate(0deg); }  70% { -moz-transform: translate(2px, 1px) rotate(-1deg); }  80% { -moz-transform: translate(-1px, -1px) rotate(1deg); }  90% { -moz-transform: translate(2px, 2px) rotate(0deg); }  100% { -moz-transform: translate(1px, -2px) rotate(-1deg); }  }  @-webkit-keyframes goyang{  0% { -webkit-transform: translate(2px, 1px) rotate(0deg); }  10% { -webkit-transform: translate(-1px, -2px) rotate(-1deg); }  20% { -webkit-transform: translate(-3px, 0px) rotate(1deg); }  30% { -webkit-transform: translate(0px, 2px) rotate(0deg); }  40% { -webkit-transform: translate(1px, -1px) rotate(1deg); }  50% { -webkit-transform: translate(-1px, 2px) rotate(-1deg); }  60% { -webkit-transform: translate(-3px, 1px) rotate(0deg); }  70% { -webkit-transform: translate(2px, 1px) rotate(-1deg); }  80% { -webkit-transform: translate(-1px, -1px) rotate(1deg); }  90% { -webkit-transform: translate(2px, 2px) rotate(0deg); }  100% { -webkit-transform: translate(1px, -2px) rotate(-1deg); }  } 


 5) Klik Simpan
Sekarang coba lihat salah satu posting blog yang terdapat gambar atau foto maka pengaruh bergoyang pun akan mengiringinya pada saat anda melakukan hover. Enjoy & Happy Coding!
Sumber https://8tutorialandroid.blogspot.com/ Baca Juga : Pertimbangkan-dalam-membuat-logo


Bagaimana Reaksi Anda Tentang Artikel Ini?

Komentar

Posting Komentar

SILAKAN KOMENTAR SESUAI TOPIK.....

POPULAR POST

CARA MELAKUKAN KADERISASI DENGAN MEMILIH KARYAWAN TERBAIK

🔓Owner Post Published 🕕
CARA MELAKUKAN KADERISASI DENGAN MEMILIH KARYAWAN TERBAIK Salah satu hal yang sulit di dalam sebuah usaha adalah mencari karyawan yang sesuai dengan keinginan atau kriteria Anda yang tentunya berkualitas dan mampu dalam menjalankan tugasnya. Mencari orang yang tepat membutuhkan sebuah konsentrasi yang cukup tinggi dan juga pengalaman yang banyak. Ketika usaha Anda masih baru, tetapi permintaan pasar semakin besar maka Anda pasti membutuhkan beberapa karyawan. Oleh karena itu ada beberapa langkah dan cara melakukan kaderisasi yang dapat Anda gunakan untuk mempermudah di dalam mendapatkan karyawan yang berkualitas sesuai dengan keinginan dan kriteria, antara lain sebagai berikut : Menentukan kualifikasi Sebelum mencari karyawan, Anda harus menentukan sebuah kualifikasi terlebih dahulu atau dengan cara melakukan kaderisasi. Karena pada setiap posisi di dalam usaha tentu membutuhkan seseorang dengan kualitas tertentu. Contohnya pada saat Anda mencari marketing, maka harus me...
Posting Komentar
🔗BACA SELENGKAPNYA »

OMZET BISNIS PARSEL DIMUSIM PANDEMI COVID-19 MENGGIURKAN

🔓Owner Post Published 🕕
ilustrasi parsel Telah menjadi tradisi, pada perayaan hari-hari besar keagamaan seperti lebaran, natal, imlek saling memberikan bingkisan parsel kepada keluarga, teman, dan relasi. Hal ini bisa dijadikan peluang bisnis parsel. Bisnis ini mendatangkan untung besar, sekitar Rp4 juta - Rp5 juta per bulannya. Namun kali bisnis parsel dimusim pandemi Covid-19 tidak kalah penting, apalagi dengan diberlakukannya PPKM oleh Pemerintah. Jangan khawatir, bisnis parsel ini juga bisa dijalankan di hari biasa. Banyak juga platform bisnis online yang ikut andil menjalan usaha ini adalah ; tokopedia, soophe, dan bukalapak. Penjualan parcel sebetulnya sudah ada langganan setiap tahunnya, namun biasanya jika kondisi sepi seperti ini, para pedagang mengandalkan langganan mereka yang biasa membeli parsel, pada umumnya mereka dari perusahaan atau perorangan. Mengutip dari buku Top 50 Bisnis Super Laris Paling Dicari  berikut persiapan dan tips jitu sukses bisnis parsel. Persiapan yang harus dilakukan a...
Posting Komentar
🔗BACA SELENGKAPNYA »

HABIB LUTHFI DIURUTAN KE 32 DARI 500 MUSLIM PALING BERPENGARUH DIDUNIA

🔓Owner Post Published 🕕
Habib Luthfi Rais Aam Jam'iyyah Ahlit Thariqah Al-Mu'tabarah An-Nahdliyah (JATMAN) Maulana Habib Muhammad Luthfi bin Yahya kembali masuk dalam 500 Muslim Paling Berpengaruh di dunia 2021, tepatnya di urutan ke-32 seperti dirilis The Muslim 500.  Dalam klasifikasi cendekiawan dan ulama, Habib yang mendapat gelar doktor honoris causa dari Universitas Negeri Semarang (Unnes) itu berada di urutan ke-19.  Di tahun sebelumnya (2020), Anggota Dewan Pertimbangan Presiden (Wantimpres) ini berada di urutan ke-33, ke-37 di tahun 2019, dan ke-41 di tahun 2018.  Habib Luthfi dinilai berpengaruh karena telah mendirikan ribuan sekolah, masjid, dan zawiah di Indonesia.  Selain itu, Habib Luthfi juga memiliki jutaan pengikut.  Kanzus Shalawat, sebuah majelis yang didirikannya di Pekalongan, Jawa Tengah tak pernah sepi dari jamaah. Ia menekankan akan pentingnya laku spiritual dan beragam bacaan wirid.   Di samping itu, sebagaimana diketahui, Habib Luthfi juga menginisia...
Posting Komentar
🔗BACA SELENGKAPNYA »

TIPS PENTING DALAM MEMULAI BISNIS DENGAN TOKO ONLINE

🔓Owner Post Published 🕕
Tips Penting Dalam Memulai Bisnis dengan Toko Online  Untuk memulai bisnis hal yang perlu pertama kali anda harus ketahui adalah bagaimana meletakkan Mindset anda yang benar pada bisnis tersebut.  Dan begitupun dengan bisnis toko online atau Dropshipping atau secara umum bisnis yang menjual produk dengan menggunakan Toko online. Agar bisnis anda bisa berjalan sebagaimana mestinya sesuai dengan hasil yang Anda harapkan. Berikut Tips penting yang perlu Anda pelajari untuk memulai bisnis dengan toko online ataupun dropshipping : 1. Siap Melayani Sang “Raja” Persiapan mental Anda untuk melayani pembeli seperti yang kita sering kita dengar “Pembeli Adalah Raja” itu ada benarnya tapi tidak seutuhnya benar apalagi pembeli yang juga tidak beretika.  Nah dalam hal ini Anda harus benar benar siap melayani (Menjawab pertanyaan, Ingin di respon cepat dan produk yang sesuai harapan) dan mempersiapkan hal yang apa saja yang akan membantu dalam hal Ini, misalnya Hp yang d...
Posting Komentar
🔗BACA SELENGKAPNYA »

KOMUNIKASI VERBAL

🔓Owner Post Published 🕕
KOMUNIKASI VERBAL :  Istilah verbal dalam kamus bahasa indonesia adalah lisan, maksudnya   komunikasi dilakukan antara pembicara dan pendengar hanya menggunakan lisan   saja. Sedangkan dalam ilmu komunikasi menyatakan bahwa istilah komunikasi   verbal yaitu proses penyampaian informasi berupa lisan dan tulisan. Komunikasi verbal adalah bentuk komunikasi yang ada dalam kehidupan manusia  dalam hubungan atau interaksi sosialnya pengertian komunikasi verbal   (verbal communication) adalah bentuk komunikasi yang disampaikan  komunikator kepada komunikan dengan lisan (oral) atau tulisan (written).  Dari pengertian komunikasi verbal tersebut maka jelas peranannya sangat   besar karena sebagian proses komunikasi langsung dengan komunikasi verbal   ide-ide, pemikiran atau keputusan lebih mudah disampaikan secara verbal   daripada non verbal. Pada komunikasi verbal ini komunikan juga lebih mudah...
Posting Komentar
🔗BACA SELENGKAPNYA »