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

BIOGRAFI HANIF DHAKIRI : KABINET INDONESIA KERJA JABATAN MENTERI KETENAGAKERJAAN

🔓Owner Post Published 🕕
Biografi Hanif Dhakiri. Saat ini ia dikenal sebagai seorang tokoh politikus Indonesia. Ia pernah menjadi anggota DPR menjadi Menteri Ketenagakerjaan serta Menteri Olahraga pada masa pemerintahan Presiden Joko Widodo. Berikut biografi Hanif Dhakiri beserta profil dan biodata lengkapnya. Biografi Hanif Dhakiri Daftar Isi Biodata Hanif Dhakiri Nama Lengkap : Muhammad Hanif Dhakiri, S.Ag., M.Si. Lahir : Semarang, 6 Juni 1972 Orang Tua : H Zuhri Maksum (ayah), Hj. Siti Hafsoh (ibu) Istri : Marifah Hanif Dhakir Anak : Nabila Setia Izzati, Neilan Setia Izzata, Nameera Setia Izzati Agama : Islam Pekerjaan : Politikus, Menteri Ketenagakerjaan, Plt. Menteri Olahraga Biografi Hanif Dhakiri Hanif Dhakiri dilahirkan di Semarang pada tanggal 6 Juni 1972. Ayahnya bernama H Zuhri Maksum dan ibunya bernama Hj. Siti Hafsoh. Keluarga Hanif Dhakiri bisa dibilang pas-pasan. Ayah Hanif bekerja sebagai guru agama islam yang mengajar sekolah dasar. Dan ibunya diketahu...
Posting Komentar
🔗BACA SELENGKAPNYA »

KISAH NABI KHIDIR DAN KOTA YANG BERUBAH

🔓Owner Post Published 🕕
Ilustrasi Gambar Dihikayatkan bahwa Nabi Khidhir 'alaihis salam suatu saat ditanya, "Apa yang paling mengherankan yang pernah engkau lihat selama umurmu?"  Beliau kemudian menjawab, "Yang paling mengherankan yang pernah aku lihat,  bahwasanya suatu saat  aku pernah melewati sebuah gurun yang kering nan gersang. Kemudian aku meninggalkannya selama lima ratus tahun.  Kemudian aku melewatinya kembali. Ternyata aku melihatnya menjadi kota yang megah dan menakjubkan, yang dipenuhi pohon-pohonan dan sungai-sungai."  Kemudian aku bertanya kepada salah satu penduduknya, "Sudah berapa tahun kota ini menjadi seramai ini?" Ia menjawab, "Maha Suci Allah. Kami, ayah-ayah kami dan kakek-kakek kami tidak mengetahuinya kecuali sudah seperti ini." Lalu aku meninggalkannya selama lima ratus tahun lagi. Kemudian aku melewatinya lagi. Ternyata kota itu menjadi lautan yang luas dan aku melihat seorang nelayan di situ, lalu aku bertanya kepadanya, "Wahai oran...
Posting Komentar
🔗BACA SELENGKAPNYA »

GERAKAN ISLAM DI TANAH BANJAR : BEBERAPA KISAH RECEH TUAN GURU DI TANAH BANJAR

🔓Owner Post Published 🕕
Beberapa Kisah Receh Tuan Guru di Tanah Banjar Hairus Salim dalam esai Gus Dur dan Guru Sekumpul: Sebuah Pertemuan menggambarkan pemasangan poster foto ulama adalah salah satu wujud penghormatan terhadap para ulama. Ulama atau Tuan Guru memiliki posisi penting dan penghormatan pada mereka hanya salah satu dari artikulasi keberislaman masyarakat Banjar. Dalam perjalanan pulang dari Banjarmasin, Hairus Salim mengisahkan bahwa seperti umumnya warung dan rumah orang Banjar di kawasan Kalimantan Selatan, dinding warung tersebut dipenuhi poster foto-foto ulama. Kisah yang dimuat di laman NU Online tersebut mengisahkan poster foto ulama tersebut merujuk pada sosok KH. Muhammad Zaini bin Abdul Ghani atau akrab dengan Guru Sekumpul dan KH. Abdurrahman Wahid atau Gus Dur. Memang, jika bepergian ke tanah Banjar, maka poster foto ulama akan sangat mudah ditemui. Tidak saja di tempat makan, sebagaimana cerita Hairus Salim, namun di rumah, tempat kerja dan lain-lain, masyarakat Banjar juga sering me...
Posting Komentar
🔗BACA SELENGKAPNYA »

DIATAS LANGIT MASIH ADA LANGIT

🔓Owner Post Published 🕕
“Di atas langit masih ada langit” merupakan ungkapan yang sering digunakan untuk mengingatkan kita agar tidak berlaku sombong atas apa yang kita miliki, baik itu kekayaan, kecantikan, ketampanan, dan kepintaran. Hal-hal yang bersifat duniawi memang seringkali menjadi sebab seseoang untuk berlaku sombong. Padahal kita tidak berhak berlaku sombong, karena sesungguhnya apa yang kita miliki  hanyalah titipan dari Allah yang seharusnya kita jaga sebaik-baiknya. Kita tidak pernah tahu sampai kapan semua yang kita miliki akan menjadi milik kita, sehingga kita tidak boleh menyombongkannya. Orang-orang kaya bisa bangkrut dan menjadi miskin, orang yang  cantik dan tampan akan bertambah tua, lalu apa yang hendak kita sombongkan?   Penyebab sifat sombong yang ada dalam diri kita adalah karena kita seringkali merasa lebih baik dari orang lain, kita selalu merawa t bahwa kedudukan kita lebih tinggi, kita pun seringkali merasa lebih cantik dari orang lain. Hal-hal semacam inil...
Posting Komentar
🔗BACA SELENGKAPNYA »

MENGAPA GOSIP DIKANTOR MEMBUNUH PRODUKTIVITAS

🔓Owner Post Published 🕕
Mengapa Gosip di Kantor Membunuh Produktivitas? Bermula dari satu hal, satu orang ke orang lainnya lambat laun sebuah infomasi terus bertambah kontennya. Informasi tersebut akhirnya berubah menjadi gosip. Gosip di kantor merupakan hal yang tidak bisa dipastikan kebenarannya. Seringkali hal tersebut justru dimulai dari rasa iri hati, frustrasi, kurang percaya diri, bahkan yang terburuk adalah candaan semata. Itu tentu saja berdampak sangat buruk. Tidak hanya bagi orang yang menjadi bahas pembicaraan, namun juga bagi pembicara. Jika diibaratkan dengan sepasang kayu dan paku. Paku sebagai rumor buruk yang Anda bicarakan dan kayu sebagai orang yang dibicarakan. Anda memukulkan paku tersebut kepada kayu hingga menyakitinya. Bahkan meskipun Anda telah mencabut paku tersebut, lubang tersebut masih saja tersisa. Seperti inilah luka yang diakibatkan oleh rumor buruk yang Anda perbuat terhadap seseorang. Membicarakan hal buruk mengenai sesama kita dapat menyebabkan sakit hati bagi s...
Posting Komentar
🔗BACA SELENGKAPNYA »