Featured Content Glider Not Working For Me

[JeanJean]

1) Script Title: Featured Content Glider

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...tentglider.htm

3) Describe problem:

The glider does not work. No matter what changes I seem to make, no go.
I have the three associated files linked in properly, and the code looks right to me - but it doesn't glide. Any advice is appreciated; I'm on deadline and pulling my hair out a little.

<div id="wrapcenter">
     <script type="text/javascript">

	featuredcontentglider.init({
	gliderid: "my-glider", //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]
	})
	</script>

     <form id="form1" runat="server">
	<div id="my-glider" class="glidecontentwrapper">     
     
     	<div class="glidecontent"><asp:Label ID="lblRecipe1" runat="server" Text=""></asp:Label><a href="http://www.cafepress.com/ShopCAOlives.314563972" target="_blank"><img 
     	src="/images/homepage/home-calendar-ad.jpg" alt="Calendar" width="369" height="211" /></a><asp:Label ID="lblRecipe2" runat="server" Text=""></asp:Label></div>
          
		<div class="glidecontent"><asp:Label ID="lblRecipe3" runat="server" Text=""></asp:Label><a href="#" target="_blank"><img src="/images/homepage/home-recipebook-ad.jpg"
           alt="Calendar" width="369" height="211" /></a><asp:Label ID="lblRecipe4" runat="server" Text=""></asp:Label></div>
           
     </div>
	</form>
     <div id="p-select" class="glidecontenttoggler">
     <div class="controller1"><a href="#" class="prev"><img src="/images/homepage/x-glider-left.gif" alt="more" width="19" height="211" /></a></div>
     <div class="controller2"><a href="#" class="next"><img src="/images/homepage/x-glider-right.gif" alt="more" width="19" height="211" /></a></div>
     </div> 
     </div>

You can see it in action here:
http://65.192.120.145/

[ddadmin]

Did you remember to upload the .css file associated with the script, and add the required reference to it on your page? Please post a link to the page on your site that contains the problematic script so we can check it out.

[JeanJean]

Hello dd!

Yes, all three files are linked.
The URL of the page is at the end of my original post.
Thanks!

[ddadmin]

Hmm there's something within your page that's causing the glide contents to be hidden, most likely with your CSS. I tried saving a local copy of your page, then basically started systematically removing portions of the page not related to the script to isolate the problem. However, nothing short of stripping everything except the script worked.

Try creating a blank page and start with just Featured Content Glider on it. Verify it works. Then, gradually add back the rest of the page elements, verifying each step that the script still works. That's unfortunately what you need to do in this case to find out what the problem is.