Results 1 to 5 of 5

Thread: Featured Content Slider Using jQuery UI not functioning within DHTML Tab Menu Content

  1. #1
    Join Date
    Dec 2010
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Featured Content Slider Using jQuery UI not functioning within DHTML Tab Menu Content

    1) Script Title: DD Tab Menu and Featured Content Slider Using jQuery UI

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

    3) Script URL of Featured Content Slider Using jQuery UI
    http://webdeveloperplus.com/jquery/f...ing-jquery-ui/

    4) Script URL of my implementation of both script.
    http://www.livegigscentral.com/dhtml/demo02.htm

    5) Problem: I've integrated the featured content slider in one of the default content section of the tab menu as you can see on the link on point 4. The slider is working perfectly when until i click on other tab menu and then back tab menu 1. The slider seize to work no more and worst the other featured content slides are appearing below the first one. Advise appreciated.

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,030
    Thanks
    44
    Thanked 3,211 Times in 3,173 Posts
    Blog Entries
    12

    Default

    This is due to browsers' (all of them) inability to initialize javascript coded spatial layout inside of a display: none; container.

    There could also be other problems. But to get around the above limitation, in each of the DD Tab Menu's css files change (at the end):

    Code:
    .tabcontent{
    display:none;
    }
    to:

    Code:
    .tabcontent {
    position: absolute;
    visibility: hidden;
    }
    And in the ddtabmenu.js file, find:

    Code:
    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"
    },
    Replace it with:

    Code:
    showsubmenu:function(tabid, targetitem){
    	var menuitems=this[tabid+"-menuitems"], i, ts, mis;
    	this.clearrevert2default(tabid)
     for (i=0; i<menuitems.length; i++){
    		menuitems[i].className=""
    		if (typeof menuitems[i].hasSubContent!="undefined"){
    			mis = document.getElementById(menuitems[i].getAttribute("rel")).style;
    			mis.position = mis.visibility = "";
    		}
    	}
    	targetitem.className="current"
    	if (typeof targetitem.hasSubContent!="undefined"){
    		ts = document.getElementById(targetitem.getAttribute("rel")).style;
    		ts.position = "static";
    		ts.visibility = "visible";
    	}
    },
    As I say, the could be other problems. If after making the changes and clearing the browsers cache and refreshing the page before checking, you want more help, let me know.
    - John
    ________________________

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

  3. #3
    Join Date
    Dec 2010
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks John. I'll try this out. Will let you know. Appreciate the help.

  4. #4
    Join Date
    Dec 2010
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    John i got to apologize. I must've confused myself sending you the wrong link of sample. I'm using the ajax tab content script.

    Site : http://www.dynamicdrive.com/dynamici...axtabscontent/

    This is the script hosting the featured content slider. Please advise.

    Thanks,
    Ken

  5. #5
    Join Date
    Dec 2010
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Hi John or Dynamic Drive Team, Any thoughts on this. Very much appreciated.

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
  •