Cara Membuat Menu Facebook, Twitter, RSS dan Google Plus Melayang Dengan Efek 3D
Cara Membuat Menu Facebook, Twitter, RSS dan Google Plus Melayang Dengan Efek 3D
1. Login ke blog kamu.
2. Pilih Tata Letak > Add Gadget > HTML/JavaScript.
3. Copy kode dibawah ini.
<style> .TNT-flt-wdt { position:fixed; right:10px; top:36% ; } .TNT-flt-wdt img { float:right; clear:right; margin:1px; -webkit-transition: all .0s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } .TNT-flt-wdt img:hover { -moz-transform: scale(1.2) rotate(6deg); -webkit-transform: scale(1.2) rotate(6deg); -o-transform: scale(1.2) rotate(6deg); -ms-transform: scale(1.2) rotate(6deg); transform: scale(1.2) rotate(6deg); } </style> <div class="TNT-flt-wdt"> <style> .TNT1 { display: block; width: 64px; height: 64px; background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjB_SwvUmBhNZLChosJTY9OrV85F0rzpd-fUGzOqC_Xd0hkGqx_PxGUYeECBfm0XYUbC1Et5q-8Sg8vatU8GNDCc7weH3_n2uJz3JJzWxEdG1HbVhCM8KAPGOqIXUgiQTJWIeV16-bNOcWx/s1600/Facebook+Icon.png') bottom; text-indent: -99999px; } .TNT1:hover { background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjtGSIPUqpaPWgEPkvcW5LCGCS93mGi8URIsCPmhvVNUHTqym4MAdlgcmP3ssSvG6MSyPwj0_Te-itB-fhUbavZuvw9-j17X-ftEpSQhhvUgdv0_rocT4EvvM8yFDvfAfNGxw8z9jEjJadE/s1600/Facebook+Rollout+Image.png') bottom; height: 64px; } </style> <a class="TNT1" href="www.facebook.com/BLAZERBLOG"></a> <style> .TNT2 { display: block; width: 64px; height: 64px; background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDi9C-B5iHkrb-oDbSyFqwAfbHeu_VHEPivB7Pc1Csq-a6g1NpYI98-DwPkFERt6WICLxvG0S8WGL4WuljAjQDQycm078_cNzJ7_quOKU3Nuszs5LQSI19hnlVV3qGu3S5VYS4RfFrTwMq/s1600/Twitter+Icon.png') bottom; text-indent: -99999px; } .TNT2:hover { background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnw8OEXuOKlaOBOXSLotidgonmxTJWdIQaEsyJDkhpUfjnZlmoxXLgHR6DGe-ahsl_uL1MoEfZTomG-8BtMXqQS2NrqsiHB1w-o3yeRoPwq0C7opcIwHeHnrXafXAC6jy3usXgqKl_93Jw/s1600/Twitter+Rollout+Image.png') bottom; height: 64px; } </style> <a class="TNT2" href="https://twitter.com/blazer_blog"></a> <style> .TNT3 { display: block; width: 64px; height: 64px; background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglktN7lvy-DHcftWkJOMlunx0kKrgm9BjO0CHKC6ew1Bbvi3IpWlGF5-9Kq0JRwBKgF4uZ8geTiUfgaCzm-jFfB-l_eWzTPKLHjy8qCI8PNLFxO4qsmHcTmWnIxNR6V1lWUNRjUyzC8m3c/s1600/Feedburner+Icon.png') bottom; text-indent: -99999px; } .TNT3:hover { background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiki3b3mKX4nLvBh4cNPX_GY9CuK6JhNdn_YeJMkyE5Uo8UTrNm7T6mSg7ZkK7y-nHNRkx-x6PBPuDtY_QdNaMNZ3KviguiYcJp9621xpF7RrNd5fIead2O6ZzszlIQmtF0RgO4S2nCOdu9/s1600/Feedburner+Rollout+Image.png') bottom; height: 64px; } </style> <a class="TNT3" href="http://feeds.feedburner.com/blazer_blog"></a> <style> .TNT4 { display: block; width: 64px; height: 64px; background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiE5esWvirYuv9-eCyjed2gcu4OR3DXWdQr175BczJuG0I7FCJsBiLhHNF3vRADpPhyphenhypheny0EgGfGxeIBj9uolmV80yZc_RQvouM36ehNyR1AbtetMU09EMgBkVMvdlcdfxreWll-u4lFayGrT/s1600/Google+Icon.png') bottom; text-indent: -99999px; } .TNT4:hover { background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjufECiC7BFxqsMFAAhniXOBU05vGkq950f8px_MNMdyfNKPDWUAeq9JYO6CNPmv4kJKVS3QSrVFDjeuUTzZ_Kow2jZ3YBiO7Ud94K3k2aNh7F61s2cWCalYuB4P0MnurctJKCoQcA9LmGw/s1600/Google+Rollout+Image.png') bottom; height: 64px; } </style> <a class="TNT4" href="https://plus.google.com/114849896378202892510"></a>Ganti kode yang berwarna merah dengan username masing-masing dari Anda.
Komentar
Posting Komentar