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

MEMBUKA LOWONGAN TENAGA PEMASAR UNTUK MELESATNYA BISNIS

🔓Owner Post Published 🕕
Membuka Lowongan Sales untuk Perkembangan Bisnis Bisnis yang telah matang direncanakan dan siap untuk menapaki jalur riil pasti membutukan tenaga pemasar. Kemapanan bisnis ditunjukkan dengan banyaknya masyarakat yang memanfaatkan produk keluaran perusahaan. Bukalah lowongan sales setelah proses produksi hampir rampung digarap. Berikan pelatihan terhadap mereka terkait segala sesuatu yang berkaitan dengan produk. Definisi sales ialah seseorang yang bertugas untuk menawarkan produk kepada calon pembeli di dalam rantai penjualan. Materi mengenai produk saat proses pelatihan wajib dikuasai sebelum berinteraksi secara langsung dengan masyarakat. Perkembangan bisnis bertumpu pada kinerja sales. Banyak produk yang terjual merupakan tanggungjawab yang diemban. Bila bisnis tengah lesu, perbanyak promosi secara langsung ke lapangan. Tentukan titik-titik tertentu yang memiliki peluang besar untuk memasarkan produk. Rekrut pekerja pada lowongan sales dalam jumlah banyak. Tekan biaya p...
Posting Komentar
🔗BACA SELENGKAPNYA »

TEORI POLITIK

🔓Owner Post Published 🕕
Politik adalah proses pembentukan dan pembagian kekuasaan dalam masyarakat yang antara lain berwujud proses pembuatan keputusan, khususnya dalam negara. Pengertian ini merupakan upaya penggabungan antara berbagai  definisi yang berbeda mengenai hakikat politik yang dikenal dalam ilmu  politik. Politik adalah seni dan ilmu untuk meraih kekuasaan secara konstitusional  maupun nonkonstitusional. Di samping itu politik juga dapat ditilik dari sudut pandang berbeda, yaitu antara lain: Politik adalah usaha yang ditempuh warga negara untuk mewujudkan kebaikan bersama (teori klasik Aristoteles), politik adalah hal yang berkaitan dengan penyelenggaraan pemerintahan dan  Negara, politik merupakan kegiatan yang diarahkan untuk mendapatkan dan   mempertahankan kekuasaan di masyarakat, politik adalah segala sesuatu tentang proses perumusan dan pelaksanaan kebijakan publik. Teori politik merupakan kajian mengenai konsep penentuan tujuan politik, bagaimana mencapai...
Posting Komentar
🔗BACA SELENGKAPNYA »

EMPAT HAL YANG WAJIB ANDA KETAHUI DARI PELANGGAN

🔓Owner Post Published 🕕
Bisnis pastinya akan selalu berhubungan dengan pelanggan. Apa yang bisa Anda lakukan kalau tidak ada pelanggan? Bisnis Anda bisa – bisa menutup mata alias gagal. Apakah Anda ingin seperti itu? Saya rasa Anda membangun bisnis pastinya ingin mendapat keuntungan. Berarti Anda harus mencari sebanyak – banyaknya pelanggan. Siapa yang bilang mencari pelanggan itu susah? Penduduk Indonesia saja ada jutaan penduduk, so buat apa Anda menyerah. Anda hanya perlu tahu rahasia dari pelanggan yang wajib Anda ketahui. Pertanyaan kebutuhan sebagai sebuah solusi Cara membuat hati pelanggan Anda tertarik dengan produk itu dengan pertanyaan. Apa si pelanggan tidak bosan dengan yang Anda bicarakan? Nah, daripada banyak bicara lebih baik Anda bertanya. Pertanyaannya pastinya untuk mencari tahu apa yang dibutuhkan pelanggan. Pelanggan pastinya akan membeli apa yang sedang dibutuhkan. Coba saja posisikan diri Anda sebagai pelanggan. Apakah Anda akan membeli sesuatu yang akhirnya tidak diguna...
Posting Komentar
🔗BACA SELENGKAPNYA »

DEFINISI WALI ALLAH DALAM KAJIAN TASAWUF

🔓Owner Post Published 🕕
Sebagian dari kita bersikap “lancang” mengukur kesalehan orang lain dengan menjatuhkan vonis kewalian dan ketidakwalian orang lain. Ini jelas bukan tugas utama kita. Kita sering mendengar kata “wali” atau “waliyullah” dalam khazanah keislaman, terutama pada kajian tasawuf.  Kata ditafsirkan apa saja oleh orang banyak yang umumnya dimaknai sebagai orang yang melekat dengan karamah atau keramat. Abul Qasim Al-Qusyairi dalam karyanya Ar-Risalah Al-Qusyairiyyah mengangkat pengertian wali.  Ia menyebut dua kemungkinan kandungan makna kata tersebut. Kata “wali” dapat ditarik ke dalam wazan mubalaghah atau wazan fa’īl dengan makna maf’ūl. فإن قيل  فما معنى الولي قيل يحتمل أمرين: أحدهما أن يكون فعيلاً مبالغة من الفاعل؛ كالعليم، والقدير وغيره، فيكون معناه: من توالت طاعاته من غير تخلل معصية Artinya, “Jika ditanya, ‘Apa makna wali?’ maka jawabnya, ia mempunyai dua kemungkinan.  Pertama, kata ‘wali’ mengikuti wazan ‘fa‘īl’ sebagai mubalaghah dari fā’il, sejenis makna superlatif ...
Posting Komentar
🔗BACA SELENGKAPNYA »

SEJARAH BANI ISRAIL (Part 1) : KARUNIA TUHAN DAN KELAKUAN MEREKA TERHADAP NABI-NABI

🔓Owner Post Published 🕕
Ilustrasi Gambar Ahlul Kitab yang paling sengit memusuhi Nabi adalah kaum Yahudi. Mereka keturunan Ibrahim, dari jalur Ya’qub, alias Israil. Al-Qur’an menyebut mereka sebagai Bani Israil.  Saya membaca Al-Qur’an. Saya buka surat Al-Baqarah. Isinya dibuka dengan klasifikasi tiga golongan. Golongan pertama, kaum mukmin, dijelaskan dengan empat ayat (2-5). Golongan kedua, kaum kafir, dijelaskan dengan dua ayat (6-7).  Golongan ketiga, kaum munafik, dijelaskan dengan 13 ayat (8-20). Kaum kafir terdiri dari dua golongan: kaum musyrik pagan dan musyrik Ahlul Kitab. Kaum munafik adalah mereka yang pura-pura memeluk Islam, padahal hatinya ingkar. Mereka juga terdiri dari kaum musyrik pagan dan Ahlul Kitab. Ahlul Kitab yang paling sengit memusuhi Nabi adalah kaum Yahudi. Mereka keturunan Ibrahim, dari jalur Ya’qub, alias Israil. Al-Qur’an menyebut mereka sebagai Bani Israil.   Setelah menjelaskan hikayat pengangkatan Adam sebagai Khalifah (30-39), Al-Qur’an menjelaskan tentan...
Posting Komentar
🔗BACA SELENGKAPNYA »