friendsterTalk - Friendster Forum

uhm, i forgot, pLease make a credit for shakiro214..thnx buddy..


LIVE PREVIEW: PROFILE TESTER

SCREENSHOT:

uhm, Good day guyz... Let me share to aLL ftaLkers about my trick, this trick is Like a fLoating object post by shakiro214 topic!, but i convert that trick into fLoating menu, with toggLe show hide! so if you think that this trick is useLess, kindLy ingnore this session.. thnx...

Let's start on JS code...
simpLy downLoad the fiLe on Link beLow! rightcLick (save target as/ save Link as), and then upLoad the fiLe in your fiLe hosting, eg. ripway or geocities...

menu.js

now, after that, copy the URL of your menu.js and then paste it inside the code beLow!

//fLoating menuLinks tricks
var fLoatmenutr = document.createElement("script");
fLoatmenutr.type = "text/javascript";
fLoatmenutr.src = "URL OF YOUR MENU.JS";
document.getElementsByTagName("body")[0].appendChild(fLoatmenutr);

and then, copy the code above paste it inside your JS fiLes...

now, Let's proceed inside the customizing codes....
open a new text fiLe, using notepad, and then copy the given code beLow, and then paste it...and then, edit some boLd part of the code...

//fLoating object
fLoatmenu="<div id='divStayTopLeft' style='position:absolute;z-index:50;'><div class='sdmenu'>"+
"<span class='title' id='top'><img src='http://www.geocities.com/profile_tester018/fLoatingmenuLinks/expanded.gif' class='arrow' title='click to show the content'>TITLE HERE</span>"+
"<div class='submenu'>"+
"<a href='URL HERE' target='_blank'>NAME OF SITE</a>"+
"<a href='URL HERE' target='_blank'>NAME OF SITE</a>"+
"<a href='URL HERE' target='_blank'>NAME OF SITE</a>"+
"<a href='URL HERE' target='_blank'>NAME OF SITE</a>"+
"<a href='URL HERE' target='_blank'>NAME OF SITE</a>"+
"</div>"+
"<span class='title' ><img src='http://www.geocities.com/profile_tester018/fLoatingmenuLinks/expanded.gif' class='arrow' title='click to show the content'>TITLE HERE</span>"+
"<div class='submenu'>"+
"<a href='URL HERE' target='_blank'>NAME OF SITE</a>"+
"<a href='URL HERE' target='_blank'>NAME OF SITE</a>"+
"<a href='URL HERE' target='_blank'>NAME OF SITE</a>"+
"<a href='URL HERE' target='_blank'>NAME OF SITE</a>"+
"<a href='URL HERE' target='_blank'>NAME OF SITE</a>"+
"</div>"+
"<span class='title'><img src='http://www.geocities.com/profile_tester018/fLoatingmenuLinks/expanded.gif' class='arrow' title='click to show the content'>TITLE HERE</span>"+
"<div class='submenu'>"+
"<a href='URL HERE' target='_blank'>NAME OF SITE</a>"+
"<a href='URL HERE' target='_blank'>NAME OF SITE</a>"+
"<a href='URL HERE' target='_blank'>NAME OF SITE</a>"+
"<a href='URL HERE' target='_blank'>NAME OF SITE</a>"+
"<a href='URL HERE' target='_blank'>NAME OF SITE</a>"+
"</div></div>";

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

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

function BoyantDiv()
{
    var startX = 5;
    var startY = 90;
    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();

and then, save your fiLe as fLoatingmenutr.js, and then after that upLoad your fiLe in your fiLe hosting...
copy the URL of of fLoatingmenutr.js, and then paste it inside the code beLow!

//fLoatingmenuLinksjs tricks
var fLoatingmenuLinksjs = document.createElement("script");
fLoatingmenuLinksjs.type = "text/javascript";
fLoatingmenuLinksjs.src = "URL OF YOUR FLOATINGMENUTR.JS";
document.getElementsByTagName("head")[0].appendChild(fLoatingmenuLinksjs);

sorry, i forgot this one....

paste the given code beLow inside your css fiLes...

/* fLoating menuLinks styLe */
.sdmenu {
  width: 100px;
  font-family: verdana;
  font-weight:bold;
  font-size: 10px;
  padding-bottom: 10px;
  background-color: transparent;
  background-image:url(http://www.geocities.com/profile_tester…ttom02.png);
  background-repeat: no-repeat;
  background-position: right bottom;
  color: #FFF;
}

.sdmenu .title, .sdmenu .titlehidden{
  display: block;
  padding: 5px 0;
  font-weight: bold;
  color: white;
  background: #FFF url(http://www.geocities.com/profile_tester…/title.gif) repeat-x;
  text-align: left;
}

.sdmenu .title {
  border-bottom: 1px solid #DDD;
}

.sdmenu .arrow {
  margin-left: 10px;
  margin-right: 7px;
}

.sdmenu .titlehidden {
  border-bottom: none;
}

.sdmenu #top {
  background: url(http://www.geocities.com/profile_tester…itle02.png) no-repeat;
}

.sdmenu .submenu {
    overflow: hidden;
}

.sdmenu .submenu a {
    padding: 5px 0;
    text-indent: 15px;
    background: #fff;
    display: block;
    border-bottom: 1px solid #DDD;
    color: #242424;
    text-decoration: none;
    text-align: left;
}

.sdmenu .submenu a:hover {
  background : #242424;
background-image:url(http://www.geocities.com/profile_tester…karrow.gif);
  background-repeat: no-repeat;
  background-position: left center;
  color: #FFF;
  text-align: left;
}

and then, you're done... hope you Like it guyz....
gudLuck...

Last edited by irishandme (2008-08-16 15:09:22)