Anti Klik Kanan Dengan Gambar | New Version

Diposkan oleh Adithya Putra 

Kali ini Adithya Blog akan share script anti klik kanan, yang tentunya berbeda dari milik dickeymaru. bedanya trick ini di lengkapi dengan tombol close. Mau liat demonya, silahkan klik disini

Berikut Tutorialnya :

• Login ke blogger
• Pilih menu template >> edit HTML >> lanjutkan
• Cari Kode </body> Lalu letakkan code di bawah ini tepat diatasnya...

<style> .overlay{ background-color:rgba(0,0, 0, .9); position:fixed; top:0px; bottom:0px; left:0px; right:0px; z-index:100; } .box{ position:fixed; height:258px; width:375px; left:-80%; top:22%; background-color:rgba(0,0, 0, .4); background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0wxYDslD2RBsfk8VsVs6QDCZsraKQOCupE96K8A1NGa9aXpwyJlXPZb9kkBbnA4o8_Ooh-h0ijVZAOuHecWMueqr_irEkzKn8VKEPXGh4RYYH56UiFHL3WbcWU39vyrSPph5BZMMGDU2q/s1600/a.jpg); color:#777; font:20px arial,sans serif; padding:20px; border:1px solid #222; -moz-box-shadow: 0 1px 5px #000; -webkit-box-shadow: 0 1px 5px #000; z-index:9999; } .close{ float:right; width:36px; height:36px; background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeuLtPgQP251QxkCV0FStCQjKXVsRJvHE5yJZS41QtjfpS_GLEHZLdVFoN2CbsNdjH_XbzOt-EVdFqgNhHijxtDmxoeVrM4pV10yMdLmHifCGdUXmYVyYvm19IA2MX4c9GS5TUd9MfGaJZ/s1600/close_icon.png) repeat top left; margin-top:-45px; margin-right:-40px; cursor:pointer; } .box h1{ font:60px arial black,sans serif;line-height:0.8em; color:red; } </style>
<script src='http://anthzo.webs.com/2012-blog/disble-right-click.js' type='text/javascript'></script>
<div class='overlay' id='overlay' style='display:none;'>
</div>
<div class='box' id='box'>
<a class='close' id='close'></a>
</div>

• Ubah text yg berwarna kuning dengan url gambar kalian. 
• Gunakan gambar yg berukuran 415 x 298 agar tampilan lebih maksimal
• Setelah itu Simpan HTML milik kalian

Sekarang coba kalian lihat hasilnya, sukses kan. Sekian Tutorial blog hari ini dan semoga berguna....

Memberi Efek Hover pada Gambar di Header

Diposkan oleh Adithya Putra And Tamvan

Adithya Blog kali ini akan share cara Memberi Efek Hover pada Gambar yang ada di Header. untuk demonya silahkan klik demo di bawah ini, lalu coba kamu sorot gambar yang ada di header.

Demo

Berikut Tutorialnya...

• Login ke blogger
• Pilih menu template >> edit HTML >> lanjutkan
• Cari Kode ]]></b:skin> Lalu letakkan code di bawah ini tepat diatasnya...

a.thumbopacity img {  -moz-transition: all 0.3s ease-out;    -o-transition: all 0.3s ease-out;    -webkit-transition: all 0.3s ease-out;    -ms-transition: all 0.3s ease-out;    transition: all 0.3s ease-out;margin-top:5px;margin-left:230px; position:absolute; }
a.thumbopacity:hover img{  margin-left: 175px;  padding-left: 0px;  }

• Sesuaikan letak Gambar kalian dengan mengedit marginnya 
• Lalu copy code di bawah ini dan pastekan tepat dibawah code </head> 

<a class='thumbopacity'>
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8xmuiU2MV-dxvt1E4trEOcSfbwzeW1xcynOy4WzHuRzPtSmHToW-7uBkyOmXTNzw3u5uafg-HW2Vutig0xRL0XfRRj8X0HfoF4uK524dFzFE0ZnCNXD6tNEqASUcIgt-hfrLiAtZFAJx6/s1600/adada.png'/></a>

• Ubah kode yg berwarna hijau dengan URL gambar kalian 
• Setelah itu simpan HTML kalian dan lihat hasilnya.

Selanjutnya tinggal kalian utak atik sendiri, dan selamat mencoba