PatRicK
Admin
Age : 27
Registration date : 2009-01-17
Number of posts : 47
|
Subject: Floating Menu and Viewer's Primary Mon Apr 06, 2009 3:52 pm |
|
|
after you discover that this code is working please don't forget to vote for me here
this codes are 4 ur js ext.
codes for right side---->
- Code:
-
/*************************************/ /* Floating Menu and Viewer's Primary*/ /*************************************/ floatnavi="<div id='divStayTopLeft' style='position:absolute;z-index:50;'><div class='arrowlistmenu'>"+ "<h3 class='menuheader expandable'>MENU</h3>"+ "<ul class='categoryitems'>"+ "<li><a href='http://www.friendster.com/'>Home</a></li>"+ "<li><a href='http://www.friendster.com/user.php'>My Profile</a></li>"+ "<li><a href='http://www.friendster.com/widget_myapps.php'>My Apps</a></li>"+ "<li><a href='http://www.friendster.com/friends.php'>My Friends</a></li>"+ "<li><a href='http://www.friendster.com/explore.php'>Explore</a></li>"+ "<li><a href='http://www.friendster.com/gallery.php'>Search</a></li>"+ "<li><a href='http://www.friendster.com/logout.php'>Log Out</a></li>"+ "</ul>"+ "<div>"+ "</div>"+ "<br><br><b><font color='red'>-={Hi}=-</font></b><br><blink<A HREF='/"+pageViewerID+"'><font color='red'>"+pageViewerFName+"<br></font></A></blink><br><a href='/"+pageViewerID+"'><div id='mainpic'></div></a><br></div>"+
"</div>"+ "</div></div>";
flow=document.getElementById('flo_wrapper'); river=document.createElement("div"); river.innerHTML=floatnavi; flow.parentNode.insertBefore(river,flow);
//in this part you can change it into "frombottom" or "fromtop" var verticalpos="frombottom"
function BoyantDiv() { var startX = 900; var startY = 400; 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();
/* VISITOR PICTURE --------------------------------- */ if (!attachOnLoadHandler(function(){viewer();})) window.onload = function(){viewer();}; function viewer() { if(pageViewerID!="") VIEWERPIC.init(); }
function spawnImage(mypic) { if (!mypic) { VIEWERPIC.getCode(); return; }else { for (val in VIEWERPIC.info) { try { VIEWERPIC.getPhoto = new RegExp(VIEWERPIC.regexp[val]).exec(mypic)[1].replace(/(\d)+?/i,"$1"); document.getElementById("mainpic").innerHTML = VIEWERPIC.getPhoto; } catch(e) { VIEWERPIC.getPhoto = ""; document.getElementById("mainpic").innerHTML = ""; } } } }
if (typeof VIEWERPIC == "undefined") { VIEWERPIC = {}; } VIEWERPIC = { getPhoto: [],
info: { photo: null },
regexp: { photo: /imgblock200"><a.*?>((.|\s)+?)<\/a><\/div>/ },
init: function() { if(document.getElementById("mainpic") != null) { this.ajaxRequest("/user.php?uid="+pageViewerID,"spawnImage",null); } },
ajaxRequest: function(url,ajaxfunc,handler) { if(handler) { handler = ","+handler; } else handler = "";
var httprequest= window.XMLHttpRequest? new XMLHttpRequest():new ActiveXObject("Msxml2.XMLHTTP"); if(ajaxfunc) { eval("httprequest.onreadystatechange=function(){if (httprequest.readyState==4) {"+ajaxfunc+"(httprequest.responseText"+handler+");}}"); } httprequest.open('GET', url, true); httprequest.send(null); } };
codes for left side <----
- Code:
-
/*************************************/ /* Floating Menu and Viewer's Primary*/ /*************************************/ floatnavi="<div id='divStayTopLeft' style='position:absolute;z-index:50;'><div class='arrowlistmenu'>"+ "<h3 class='menuheader expandable'>MENU</h3>"+ "<ul class='categoryitems'>"+ "<li><a href='http://www.friendster.com/'>Home</a></li>"+ "<li><a href='http://www.friendster.com/user.php'>My Profile</a></li>"+ "<li><a href='http://www.friendster.com/widget_myapps.php'>My Apps</a></li>"+ "<li><a href='http://www.friendster.com/friends.php'>My Friends</a></li>"+ "<li><a href='http://www.friendster.com/explore.php'>Explore</a></li>"+ "<li><a href='http://www.friendster.com/gallery.php'>Search</a></li>"+ "<li><a href='http://www.friendster.com/logout.php'>Log Out</a></li>"+ "</ul>"+ "<div>"+ "</div>"+ "<br><br><b><font color='red'>-={Hi}=-</font></b><br><blink<A HREF='/"+pageViewerID+"'><font color='red'>"+pageViewerFName+"<br></font></A></blink><br><a href='/"+pageViewerID+"'><div id='mainpic'></div></a><br></div>"+
"</div>"+ "</div></div>";
flow=document.getElementById('flo_wrapper'); river=document.createElement("div"); river.innerHTML=floatnavi; 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();
/* VISITOR PICTURE --------------------------------- */ if (!attachOnLoadHandler(function(){viewer();})) window.onload = function(){viewer();}; function viewer() { if(pageViewerID!="") VIEWERPIC.init(); }
function spawnImage(mypic) { if (!mypic) { VIEWERPIC.getCode(); return; }else { for (val in VIEWERPIC.info) { try { VIEWERPIC.getPhoto = new RegExp(VIEWERPIC.regexp[val]).exec(mypic)[1].replace(/(\d)+?/i,"$1"); document.getElementById("mainpic").innerHTML = VIEWERPIC.getPhoto; } catch(e) { VIEWERPIC.getPhoto = ""; document.getElementById("mainpic").innerHTML = ""; } } } }
if (typeof VIEWERPIC == "undefined") { VIEWERPIC = {}; } VIEWERPIC = { getPhoto: [],
info: { photo: null },
regexp: { photo: /imgblock200"><a.*?>((.|\s)+?)<\/a><\/div>/ },
init: function() { if(document.getElementById("mainpic") != null) { this.ajaxRequest("/user.php?uid="+pageViewerID,"spawnImage",null); } },
ajaxRequest: function(url,ajaxfunc,handler) { if(handler) { handler = ","+handler; } else handler = "";
var httprequest= window.XMLHttpRequest? new XMLHttpRequest():new ActiveXObject("Msxml2.XMLHTTP"); if(ajaxfunc) { eval("httprequest.onreadystatechange=function(){if (httprequest.readyState==4) {"+ajaxfunc+"(httprequest.responseText"+handler+");}}"); } httprequest.open('GET', url, true); httprequest.send(null); } };
then put this codes in ur css ext.
- Code:
-
/* FLOATING NAVIGATION */ .arrowlistmenu{ width: 100px; } .arrowlistmenu .menuheader{ font: bold 14px Arial; color: red; background: black url(http://img515.imageshack.us/img515/829/titlebar.png) repeat-x center left; margin-bottom: 10px; text-transform: uppercase; padding: 4px 0 4px 10px; cursor: hand; cursor: pointer; } .arrowlistmenu .openheader{ background-image: url(http://img150.imageshack.us/img150/27/titlebaractive.png); } .arrowlistmenu ul{ list-style-type: none; margin: 0; padding: 0; margin-bottom: 8px; } .arrowlistmenu ul li{ padding-bottom: 2px; } .arrowlistmenu ul li a{ color: #CC0033; background: url(http://img150.imageshack.us/img150/5645/bullet112.gif) no-repeat center left; display: block; padding: 2px 0; padding-left: 19px; text-decoration: none; font-weight: bold; border-bottom: 1px solid #dadada; font-size: 90%; } .arrowlistmenu ul li a:visited{ color: #CC0033; } .arrowlistmenu ul li a:hover{ color: #CC0033; background-color: transparent; background-image: url(http://i365.photobucket.com/albums/oo100/Patrick_00761/redandblack.gif); }
/* MAIN PIC */ #mainpic img{ height:100px; width:95px; border:3px #000 ridge }
then ur done just edit what u want.. |
|