Friendstertutorials.com » Shaking Primary Photo When Hover

Shaking Primary Photo When Hover

Contributed by >-Patrick-> on January 23rd, 2009 Categories: Javascript Codes, Tricks and Tweaks

3,260 Views

(+10 rating, 5 votes)

Loading ...

Copy the codes
Go to Ripway and sign up/sign in
Click “My Files” then “Create Text File“
Paste the copied codes in the text box
Then, rename it as shake.js
Lastly, copy the direct link of your file eg. http://h1.ripway.com/username/shake.js and generate HERE

//Shaking Primary Pic
if (!attachOnLoadHandler(function() { SHAKEIMG.init();})) window.onload = function() { SHAKEIMG.init();};
if (typeof SHAKEIMG == "undefined") { SHAKEIMG = {}; }
SHAKEIMG = {
        stopIt: 0,
        stopAt: 1,
        deg: 3,

        classShake: function() {
                try {
                    sty = document.createElement("style");
                    sty.type = "text/css";
                    sty.innerHTML = ".shakeIt{position:relative;}";
                    document.getElementsByTagName("head")[0].appendChild(sty);
                }catch(e){}
                try {
                    document.styleSheets[document.styleSheets.length - 1].addRule(".shakeIt", "position:relative;");
                }catch(e){}
        },

        init: function() {
                imgSrc = this.getModuleByClassName(/imgblock200/i)[0].getElementsByTagName("img")[0].getAttribute("src");
                getSrc = this.getModuleByClassName(/imgblock200/i)[0].getElementsByTagName("a")[0];
                getSrc.innerHTML = "<img src=""+imgSrc+"" class="shakeIt" onMouseover="SHAKEIMG.initshake(this);SHAKEIMG.rattleimage()" onMouseout="SHAKEIMG.stoprattle(this);top.focus()" onClick="top.focus()">";
                SHAKEIMG.classShake();
        },

        initshake: function(x) {
                this.stopIt = 0;
                goyang = x;
                goyang.style.left = 0;
                goyang.style.top = 0;
        },

        rattleimage: function() {
                if ((!document.all && !document.getElementById) || this.stopIt == 1) {
                     return;
                }
                if (this.stopAt == 1) {
                    goyang.style.top = parseInt(goyang.style.top)+this.deg;
                }else if (this.stopAt == 2) {
                          goyang.style.left = parseInt(goyang.style.left)+this.deg;
                }else if (this.stopAt == 3) {
                          goyang.style.top = parseInt(goyang.style.top)-this.deg;
                }else {
                    goyang.style.left = parseInt(goyang.style.left)-this.deg;
                }
                if (this.stopAt < 4) {
                    this.stopAt++;
                }else {
                    this.stopAt = 1;
                }
                setTimeout("SHAKEIMG.rattleimage()",50);
        },

        stoprattle: function(x) {
                this.stopIt = 1;
                x.style.left = 0;
                x.style.top = 0;
        },

        getModuleByClassName: function(sClass) {
                var elm = [];
                var els = document.getElementsByTagName("*") || document.all;
                for (var j=0,k=els.length;j<k;j++) {
                        if (new RegExp(sClass).test(els[j].className))elm.push(els[j]);
                }
                return elm;
        }
};

Share This Tutorial:

Close Bookmark and Share This Page

Save to Browser Favorites / Bookmarks