Cara Membuat dan memasang Shipping

Hai sobat, sekarang saya akan memberikan anda tutor cara buat snipping, maksud dari snipping adalah ketika anda atau visitor menyorot gambar komentator, maka gambar komentator tersebut akan berputar 1 Putaran

Langkah :

• Login blogger 
• Masuk layout atau tata letak > add gedged > HTML/Javascript
• klik paste gambar di bawah ini dan klik save

<input onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" style="font-size: 10px; margin-top: 5px; width: 60px;" type="button" value="Show" /> </div>

<div style="border: 1px inset; margin: 0px; padding: 6px;">

<div style="display: none;">

<style type="text/css">

.avatar-image-container img, comments .avatar-image-container img {

-webkit-transition-duration: 0.8s;

-moz-transition-duration: 0.8s;

-o-transition-duration: 0.8s;

transition-duration: 0.8s;

</style>

<script src="http://mootools-code.googlecode.com/files/mootools-1.3.2.js"></script>

<script>

window.addEvent("domready",function() {

// "Globals" - Will make things compress mo-betta

var $random = function(x) { return Math.random() * x; };

var availableWidth = 0, availableHeight = 0;

var cssPrefix = false;

switch(Browser.name) {

case "safari":cssPrefix = "webkit";break;

case "chrome":cssPrefix = "webkit";break;

case "firefox":cssPrefix = "moz";break;

case "opera":cssPrefix = "o";break;

}

// The Icons

var icons = $$(".avatar-image-container img, comments .avatar-image-container img ");

// Apply opacity

var zIndex = 1000;

// Randomize each link

icons.each(function(element,index) {

var startDeg =(360);

var resetPlace = function() {

element.fade(0.4).setStyle("-" + cssPrefix + "-transform","rotate(" + startDeg + "deg)");

}

element.set("style","top:" + $random(availableHeight) + "px; left:" + $random(availableWidth) + "px; z-index:" + zIndex);

resetPlace();

element.addEvents({

mouseenter: function() { element.fade(1).setStyle("z-index",++zIndex).setStyle("-" + cssPrefix + "-transform","rotate(0deg)");},

mouseleave: resetPlace});

});

});

</script></div>

• Langkah terakhir tinggal Klik Save

   

     Makah hasilnya akan seperti ini :