Advanced Search

Results 1 to 6 of 6

Thread: ddtabmenu help!

  1. #1
    Join Date
    May 2013
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default ddtabmenu help!

    1) Script Title: DD Tab Menu

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex1/ddtabmenu.htm

    3) Describe problem: When the page is initially loaded it shows ALL the content for ALL the divs. After you hover over something it shows what it's supposed to, and when you mouse out everything goes away. But it's the content popping up on page load that shouldn't be happening. Not sure how to fix this. I have set the javascript to "-1" to load nothing at start.
    I also tried stripping the CSS I added and just use the default styling, but I had the same problem.

    Here's a link to my site: http://regardinghue.com/cms/frequently-asked-questions/

  2. #2
    Join Date
    Dec 2008
    Location
    Portsmouth, UK
    Posts
    1,709
    Thanks
    2
    Thanked 389 Times in 384 Posts

    Default

    Code:
    <script type="text/javascript" src="/cms/wp-content/themes/hue/js/ddtabmenu.js"></script>
    Code:
    .tabcontent {
     display:none;
    }
    Vic
    God Loves You and will never love you less.
    http://www.vicsjavascripts.org/Home.htm
    If my post has been useful please donate to http://www.operationsmile.org.uk/

  3. #3
    Join Date
    May 2013
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks vwphillips, the display none worked.

    Do you know if there is a version of this where the text will change when you "click" the tag, rather than hover over it?

  4. #4
    Join Date
    Dec 2008
    Location
    Portsmouth, UK
    Posts
    1,709
    Thanks
    2
    Thanked 389 Times in 384 Posts

    Default

    Code:
    //DD Tab Menu- Script rewritten April 27th, 07: http://www.dynamicdrive.com
    //**Updated Feb 23rd, 08): Adds ability for menu to revert back to default selected tab when mouse moves out of menu
    
    //Only 2 configuration variables below:
    
    var ddtabmenu={
    
    	disabletablinks: false, //Disable hyperlinks in 1st level tabs with sub contents (true or false)?
    	snap2original: [true, 300], //Should tab revert back to default selected when mouse moves out of menu? ([true/false, delay_millisec]
    
    	currentpageurl: window.location.href.replace("http://"+window.location.hostname, "").replace(/^\//, ""), //get current page url (minus hostname, ie: http://www.dynamicdrive.com/)
    
    definemenu:function(tabid, dselected,mde){
    	this[tabid+"-menuitems"]=null
    	this[tabid+"-dselected"]=-1
    	this.addEvent(window, function(){ddtabmenu.init(tabid, dselected,mde)}, "load")
    },
    
    showsubmenu:function(tabid, targetitem){
    	var menuitems=this[tabid+"-menuitems"]
    	this.clearrevert2default(tabid)
     for (i=0; i<menuitems.length; i++){
    		menuitems[i].className=""
    		if (typeof menuitems[i].hasSubContent!="undefined")
    			document.getElementById(menuitems[i].getAttribute("rel")).style.display="none"
    	}
    	targetitem.className="current"
    	if (typeof targetitem.hasSubContent!="undefined")
    		document.getElementById(targetitem.getAttribute("rel")).style.display="block"
    },
    
    isSelected:function(menuurl){
    	var menuurl=menuurl.replace("http://"+menuurl.hostname, "").replace(/^\//, "")
    	return (ddtabmenu.currentpageurl==menuurl)
    },
    
    isContained:function(m, e){
    	var e=window.event || e
    	var c=e.relatedTarget || ((e.type=="mouseover")? e.fromElement : e.toElement)
    	while (c && c!=m)try {c=c.parentNode} catch(e){c=m}
    	if (c==m)
    		return true
    	else
    		return false
    },
    
    revert2default:function(outobj, tabid, e){
    	if (!ddtabmenu.isContained(outobj, tabid, e)){
    		window["hidetimer_"+tabid]=setTimeout(function(){
    			ddtabmenu.showsubmenu(tabid, ddtabmenu[tabid+"-dselected"])
    		}, ddtabmenu.snap2original[1])
    	}
    },
    
    clearrevert2default:function(tabid){
     if (typeof window["hidetimer_"+tabid]!="undefined")
    		clearTimeout(window["hidetimer_"+tabid])
    },
    
    addEvent:function(target, functionref, tasktype){ //assign a function to execute to an event handler (ie: onunload)
    	var tasktype=(window.addEventListener)? tasktype : "on"+tasktype
    	if (target.addEventListener)
    		target.addEventListener(tasktype, functionref, false)
    	else if (target.attachEvent)
    		target.attachEvent(tasktype, functionref)
    },
    
    init:function(tabid, dselected,mde){
    	var menuitems=document.getElementById(tabid).getElementsByTagName("a")
    	this[tabid+"-menuitems"]=menuitems
    	for (var x=0; x<menuitems.length; x++){
    		if (menuitems[x].getAttribute("rel")){
    			this[tabid+"-menuitems"][x].hasSubContent=true
    			if (ddtabmenu.disabletablinks||mde=='click')
    				menuitems[x].onclick=function(){return false}
    			if (ddtabmenu.snap2original[0]==true){
    				var submenu=document.getElementById(menuitems[x].getAttribute("rel"))
                    if (mde!='click'){
      			     menuitems[x].onmouseout=function(e){ddtabmenu.revert2default(submenu, tabid, e)}
    			   	 submenu.onmouseout=function(e){ddtabmenu.revert2default(this, tabid, e)}
    				}
                    submenu.onmouseover=function(){ddtabmenu.clearrevert2default(tabid)}
    			}
    		}
    		else //for items without a submenu, add onMouseout effect
             if (mde=='click'){ menuitems[x].onmouseout=function(e){ this.className=""; }
              }
              else {
                menuitems[x].onmouseout=function(e){ this.className="";  if (ddtabmenu.snap2original[0]==true){ ddtabmenu.revert2default(this, tabid, e); } }
    
              }
            menuitems[x][mde=='click'?'onmouseup':'onmouseover']=function(){ddtabmenu.showsubmenu(tabid, this)}
     	if (dselected=="auto" && typeof setalready=="undefined" && this.isSelected(menuitems[x].href)){
    			ddtabmenu.showsubmenu(tabid, menuitems[x])
    			this[tabid+"-dselected"]=menuitems[x]
    			var setalready=true
    		}
    		else if (parseInt(dselected)==x){
    			ddtabmenu.showsubmenu(tabid, menuitems[x])
    			this[tabid+"-dselected"]=menuitems[x]
    		}
    	}
    }
    }
    + a new parameter

    Code:
    //SYNTAX: ddtabmenu.definemenu("tab_menu_id", integer OR "auto", 'click' or 'mouseover' default = 'mouseover')
    ddtabmenu.definemenu("ddtabs1", -1,'click') //initialize Tab Menu #1 with 1st tab selected
    Vic
    God Loves You and will never love you less.
    http://www.vicsjavascripts.org/Home.htm
    If my post has been useful please donate to http://www.operationsmile.org.uk/

  5. #5
    Join Date
    May 2013
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks again vwphillips.

    I have added your new init:function to the js file, and the new "click" parameter. The text doesn't show up when you hover anymore, but it also doesn't show up when you click. Is there something you need to change in the HTML? I have removed the link URL, and replaced it with "#", but that doesn't seem to work either.

    http://hotzon.honeycombsites.ca/testpage

  6. #6
    Join Date
    May 2013
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    nvm, I ended up using this:
    http://codepen.io/JoshBlackwood/pen/yoLBJ

    But thanks for helping me with the mouseover one!!!!

Similar Threads

  1. CSS Sprites and DDtabmenu
    By si.monday in forum Dynamic Drive scripts help
    Replies: 0
    Last Post: 02-08-2010, 04:06 PM
  2. ddtabmenu problems
    By Rasenheizung in forum JavaScript
    Replies: 1
    Last Post: 06-22-2009, 06:18 AM
  3. need help with ddtabmenu
    By beloved73 in forum Dynamic Drive scripts help
    Replies: 11
    Last Post: 11-19-2008, 07:01 PM
  4. ddtabmenu positioning trouble
    By markdlv77 in forum Dynamic Drive scripts help
    Replies: 4
    Last Post: 10-22-2007, 01:45 AM
  5. OnMouseOut DDTabMenu
    By capeck in forum Dynamic Drive scripts help
    Replies: 0
    Last Post: 09-08-2005, 06:56 PM

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
  •