PDA

View Full Version : floating menu



brokpa
02-11-2012, 02:00 PM
Hello to Dynamic drive forum members,
I have inserted floating menu to my website at the footer, the floating menu html i didnt modified, i let it same as it on the dynamic drive floating menu page.. it came to my page permanently at the left side bottom on the footer.

Now, problam is that i cannot delete or cant get into to modify, plus its not floating on the left.
Please suggest if anyone know how to delete this or how to get access to it.
infact my pages has lots of html.
Thanks for your suggestion and help.
Best regards
brok

jscheuer1
02-12-2012, 06:22 AM
You can delete it simply by getting rid of all of the code you added for it.

Modifying the contents of the menu is done in tis section (from the code block on the demo page):


<!--EDIT BELOW CODE TO YOUR OWN MENU-->
<table border="1" width="130" cellspacing="0" cellpadding="0">
<tr>
<td width="100%" bgcolor="#FFFFCC">
<p align="center"><b><font size="4">Menu</font></b></td>
</tr>
<tr>
<td width="100%" bgcolor="#FFFFFF">
<p align="left">*<a href="http://www.dynamicdrive.com">Dynamic Drive</a><br>
*<a href="http://www.dynamicdrive.com/new.htm">What's New</a><br>
*<a href="http://www.dynamicdrive.com/hot.htm">What's Hot</a><br>
*<a href="http://www.dynamicdrive.com/faqs.htm">FAQs</a><br>
*<a href="http://www.dynamicdrive.com/morezone/">More Zone</a></td>
</tr>
</table>
<!--END OF EDIT-->

As for it not floating on your page - It's an old script and will not work on a page with a DOCTYPE that invokes standards compliance. Use this version instead:


<div id="divStayBottomLeft" style="position:absolute;z-index:10;">
<!--EDIT BELOW CODE TO YOUR OWN MENU-->
<table border="1" style="width: 130px;" cellspacing="0" cellpadding="0">
<tr>
<td style="width: 100%; background-color: #ffc;" align="center">
<b style="font-size: 112.5%;">Menu</b></td>
</tr>
<tr>
<td style="width: 100%; background-color: #fff;">
<span>*<a href="http://www.dynamicdrive.com">Dynamic Drive</a><br>
*<a href="http://www.dynamicdrive.com/new.htm">What's New</a><br>
*<a href="http://www.dynamicdrive.com/hot.htm">What's Hot</a><br>
*<a href="http://www.dynamicdrive.com/faqs.htm">FAQs</a><br>
*<a href="http://www.dynamicdrive.com/morezone/">More Zone</a></span></td>
</tr>
</table>
<!--END OF EDIT-->
</div>
<script type="text/javascript">

/*
Floating Menu script- Roy Whittle (http://www.javascript-fx.com/)
Script featured on/available at http://www.dynamicdrive.com/
This notice must stay intact for use
*/



function JSFX_FloatTopDiv(id, vPos, sX, sY){
if(!document.getElementById){return;}
this.verticalpos = vPos;
this.startX = sX < 0? JSFX_FloatTopDiv.width(false) + sX - document.getElementById(id).offsetWidth : sX;
//alert(this.startX);
this.startY = sY;
var PX='px', d = document;
this.ml = function(id){
var el = d.getElementById(id), cObj = this;
el.sP = function(x,y){
el.style.left = x + PX;
el.style.top = y + PX;
};
el.x = this.startX;
if (this.verticalpos=="fromtop"){
el.y = this.startY;
}
else{
el.y = JSFX_FloatTopDiv.height(false);
el.y -= this.startY;
}
return el;
};
this.stayTopLeft=function(){
var cObj = this;
if (this.verticalpos=="fromtop"){
var pY = JSFX_FloatTopDiv.height(true);
this.ftlObj.y += (pY + this.startY - this.ftlObj.y)/8;
}
else{
var pY = JSFX_FloatTopDiv.height(false);
this.ftlObj.y += (pY - this.startY - this.ftlObj.y)/8;
}
var pX = JSFX_FloatTopDiv.width(true);
this.ftlObj.x += (pX + this.startX - this.ftlObj.x)/8;
this.ftlObj.sP(this.ftlObj.x, this.ftlObj.y);
setTimeout(function(){cObj.stayTopLeft();}, 10);
};
this.ftlObj = this.ml(id);
this.stayTopLeft();
}
if(document.getElementById){
JSFX_FloatTopDiv.trueBody = (function(){
return document.compatMode && document.compatMode!="BackCompat"?
function(){return document.documentElement;} :
function(){return document.body;}
})();
JSFX_FloatTopDiv.height = (function(){
return window.innerHeight?
function(s){return s? pageYOffset : pageYOffset + innerHeight;} :
function(s){var tb = JSFX_FloatTopDiv.trueBody(); return s? tb.scrollTop : tb.scrollTop + tb.clientHeight;}
})();
JSFX_FloatTopDiv.width = (function(){
return window.innerWidth?
function(s){return s? pageXOffset : pageXOffset + innerWidth;} :
function(s){return s? JSFX_FloatTopDiv.trueBody().scrollLeft : JSFX_FloatTopDiv.trueBody().scrollLeft + JSFX_FloatTopDiv.trueBody().clientWidth;}
})();
}

new JSFX_FloatTopDiv('divStayBottomLeft', 'frombottom', 3, 180);

</script>

If you want more help, please post a link to the page on your site that contains the problematic code so we can check it out.