Friendstertutorials.com » Floating Image on Left of your Profile

Floating Image on Left of your Profile

Contributed by Kalvin on January 25th, 2009 Categories: Javascript Codes, Tricks and Tweaks

5,398 Views

(+33 rating, 18 votes)

Loading ...

you can see the image url on the top,look for the code kalvin=

IF you want the image float on right side
look for all the word left and change it to right!
you can use .gif .jpg .png or other image types

Done Editing????
Just paste it to your JS!!!
OK
Working on IE and FF

PREVIEW HERE

/* Floating Image On Left */
/* Posted By: Kalvin on Friendstertutorials.com */

kalvin="<div id='divStayTopLeft' style='position:absolute;z-index:50;'><img src='http://i25.tinypic.com/nbxdg5.jpg' width='80px' height='80px' style='filter:none;-moz-opacity:1.0'/></div>";

flow=document.getElementById('flo_wrapper');
river=document.createElement("div");
river.innerHTML=dude;
flow.parentNode.insertBefore(river,flow);

//in this part you can change it into "frombottom" or "fromtop"
var verticalpos="frombottom"

function BoyantDiv()
{
    var startX = 15;
    var startY = 170;
    function ml(id)
    {

    if (document.getElementById)
      {
      var wek=document.getElementById(id);
      }
    else if (document.all)
      {
      var wek=document.all[id];
      }
    else
      {
      var wek=document.layers[id];
      }

        if(document.layers)
        {
        wek.style=wek;
        }
        wek.sP = function(x,y) {shino(x,y);};
        function shino(x,y)
        {
        wek.style.left=x;
        wek.style.top=y;
        }
        wek.x = startX;
        if (verticalpos=="fromtop")
           {
           wek.y = startY;
           }
        else{
           if (navigator.appName.indexOf("Netscape") != -1)
           {
           wek.y = pageYOffset + innerHeight;
           }
           else
           {
           wek.y = document.body.scrollTop + document.body.clientHeight;
           }
           wek.y -= startY;
           }
        return wek;
    }
    window.stayTopLeft = function () {boyant();};
    function boyant()
    {
        if (verticalpos=="fromtop"){

           if (navigator.appName.indexOf("Netscape") != -1)
           {
           var tenten = pageYOffset;
           }
           else
           {
           var tenten = document.body.scrollTop;
           }

           ftlObj.y += (tenten + startY - ftlObj.y)/8;
        }
        else{

           if (navigator.appName.indexOf("Netscape") != -1)
           {
           var tenten = pageYOffset + innerHeight;
           }
           else
           {
           var tenten = document.body.scrollTop + document.body.clientHeight;
           }
           ftlObj.y += (tenten - startY - ftlObj.y)/8;
        }
        ftlObj.sP(ftlObj.x, ftlObj.y);
        wakoko=setTimeout("stayTopLeft()", 50);
    }
    ftlObj = ml("divStayTopLeft");
    stayTopLeft();
}
BoyantDiv();

Share This Tutorial:

Close Bookmark and Share This Page

Save to Browser Favorites / Bookmarks