View Full Version : Featured Content Glider Toggle links

12-18-2008, 06:23 AM
1) Script Title: Featured Content Glider Toggle links

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/featuredcontentglider.htm

3) Describe problem:

hello all. this is my first post in the forums. i usually spend a few hrs fixing these problems myself, but this one has me stumped. I'm using the Featured Content Glider script again, and everything is great. but... on this particular installation i need to wrap the toggle links in an unordered list within the "p-select" container (or i could use "p-select" as the id of the UL and that's fine too), but it seems if i modify the toggle links in anyway, then they no longer toggle the content, they just become dead links. i've tried many different ways to style these links, but no luck. i have a specific application in mind and there's just no way around it, i need these toggle links to be viewed as unordered list items. its not the "look" of a list a need, it's the code structure, so adding a block image beside each link and a breaking space afterward does me no good in case your clever minds were thinking of this lol. i NEED the UL structure in the code.

Any help would be greatly appreciate. thanks :)

12-18-2008, 07:25 AM
Could you please post a link to your site or the code you are using?

12-18-2008, 09:30 PM
sure. i dont have it on a live site yet, i'm working locally, but here's the code for the page im playing with. it's exactly the same as the code given on the scripts page, i only put each toggle link in a list item (bottom of the code). this is where i'm having the trouble... everything works great until i add the UL, or change anything inside the "p-select" container. i also tried adding the "p-select" ID to the UL tag itself and removing the "p-select" container div, but no luck with that either. It seems the js looks for it to be a div with nothing else inside but the links, but i cant figure out where in the external js to change this behavior so it reads the list items properly :(

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<script type="text/javascript" src="jquery-1.2.2.pack.js"></script>

<link rel="stylesheet" type="text/css" href="featuredcontentglider.css" />

<script type="text/javascript" src="featuredcontentglider.js">

* Featured Content Glider script- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* Visit http://www.dynamicDrive.com for hundreds of DHTML scripts
* This notice must stay intact for legal use


<script type="text/javascript">

gliderid: "canadaprovinces", //ID of main glider container
contentclass: "glidecontent", //Shared CSS class name of each glider content
togglerid: "p-select", //ID of toggler container
remotecontent: "", //Get gliding contents from external file on server? "filename" or "" to disable
selected: 0, //Default selected content index (0=1st)
persiststate: false, //Remember last content shown within browser session (true/false)?
speed: 500, //Glide animation duration (in milliseconds)
direction: "downup", //set direction of glide: "updown", "downup", "leftright", or "rightleft"
autorotate: true, //Auto rotate contents (true/false)?
autorotateconfig: [3000, 2] //if auto rotate enabled, set [milliseconds_btw_rotations, cycles_before_stopping]


<div id="canadaprovinces" class="glidecontentwrapper">
<div class="glidecontent">
content 1

<div class="glidecontent">
content 2

<div class="glidecontent">
content 3

<div id="p-select" class="glidecontenttoggler">
<li><a href="#" class="toc">Page 1</a></li>
<li><a href="#" class="toc">Page 2</a><li>
<li><a href="#" class="toc">Page 3</a></li>


12-19-2008, 12:50 AM
Ah yes, the problem is because by default the script only scans direct children nodes of the pagination container for special links (ie: those with class="toc"). When you added a list, the links are no longer direct children of the DIVs, but the LIs instead.

To fix this, find the below lines in red in the .js file:


Replace the part in red with "find" instead (no quotes). I've updated the .js file officially on the script page as well btw.

12-19-2008, 02:15 AM
works like a charm! thanks for the quick replies and resolution :D