Results 1 to 2 of 2

Thread: floating menu

  1. #1
    Join Date
    Feb 2012
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Angry floating menu

    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

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    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):

    Code:
    <!--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:

    Code:
    <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.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •