1) Script Title: Featured Content Glider
2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...tentglider.htm
3) Describe problem: Receiving "featuredcontentglider not defined" in IE8.
I have included within my website, lcmorangeburg.com, a featured content glider and have implemented it as instructed and everything works as it should in Safari, however it fails to do so in IE8.Firefox also proves to be a challenge for the script to operate... What have I done wrong and why isn't it not functioning in either of the browsers?
I have included my script below as it appears within my site. Please advise as it will be greatly appreciated!
Looking forward to someone helping me resolve this issue. Thanking you in advance for your time and attention.
Script:
<script type="text/javascript">
featuredcontentglider.init({
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: 800, //Glide animation duration (in milliseconds)
direction: "rightleft", //set direction of glide: "updown", "downup", "leftright", or "rightleft"
autorotate: true, //Auto rotate contents (true/false)?
autorotateconfig: [8000, 500] //if auto rotate enabled, set [milliseconds_btw_rotations, cycles_before_stopping]
})
</script>
<div id="canadaprovinces" class="glidecontentwrapper">
<div class="glidecontent">
<img src="picture link" style="float: left; padding: 5px">
content
</div>
<div class="glidecontent">
<img src="picture link" style="float: left; padding: 5px">
content
</div>
<div class="glidecontent">
<img src="picture link" style="float: left; padding: 5px">
content
</div>
<div class="glidecontent">
<img src="picture link" style="float: left; padding: 5px">
content
</div>
</div>
<div id="p-select" class="glidecontenttoggler">
<a href="#" class="prev">Prev</a>
<a href="#" class="toc">•</a> <a href="#" class="toc">•</a> <a href="#" class="toc">•</a> <a href="#" class="toc">•</a>
<a href="#" class="next">Next</a>
</div>
Bookmarks