Featured Content Slider: real URLs+fade effect

[mamaduck]

1) Script Title: Featured Content Slider

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

3) Describe problem:

I have successfully gotten the content slider to use real URL's in the pagination tabs, but I realized that I was using a modified version of the .js file that did not include the fade transition effect. Is there any documentation about how to add the fade transition effect?

The files I am working with are here

http:www.v-linkstudio.com/macey

1 version has the fade, but no URLS for the tab, and the other is vice versa.

TIA!

[ddadmin]

Sure, try the below attached contentslider.js file. It's based on the most recent version, modified to include the Real URLs option.

[mamaduck]

Unfortunately, I still can't seem to get it working - the URL shows up in the status bar, but the page doesn't load.

The files are here: http://www.v-linkstudio.com/macey/

[ddadmin]

Ah right, there are actually two two versions of the Real URLs mode. The first one just modifies the pagination links to actual URLs for the benefit of search engines etc. Nothing else changes as far as behavior. The second version goes a step further, so clicking on a pagination link actually goes to each real URL, and mousing over the pagination links changes the featured content slider instead (instead of clicking on them)..

For the 2nd version, use the below attached .js file instead.

[mamaduck]

I'm sorry, but it's still not working

http://www.v-linksudio.com/macey/tabs3.htm

Have I set up the variables/parameters correctly?

<script type="text/javascript">
var linktext=[ "COMMERCIAL", "AGRICULTURAL", "RESIDENTIAL" , "POOL HEATING"]//custom linkstext array
var mylinks=['http://www.google.com', 'link2.htm', 'link3.htm', 'link4.htm' ]//navurls
 ContentSlider("slider1", 3000, linktext,"", mylinks)
</script>

[ddadmin]

The "tab3.htm" link you posted doesn't work. However, it looks like the parameters aren't set up properly. The Real URLs parameter should be the 5th one. For example:

var linktext=["horses", "scenery", "ocean", "sushi"]
var nexttext="Forward"
ContentSlider("slider1", 5000, linktext, nexttext, ['http://www.google.com', 'link2.htm', 'link3.htm', 'link4.htm'])

[mamaduck]

Hi, I tried setting it up the way you suggested, but it still doesn't work. The content changes when you mouse over the tabs, but the link does not work when you click. Also, if you keep your mouse on the tab, the fade up repeats to create a flicker effect. The link is here and it does work this time, sorry about that!!!

http://v-linkstudio.com/macey/tabs3.htm

The only change I made to the last script you posted was to add "display:none" to the Next button style.

[ddadmin]

Hmmm is there any reason why you're manually populating the pagination DIV with the desired links? For example:

<div class="pagination" id="paginate-slider1"></div>
<div class="statictabs"> <a href="commercial/index.html">COMMERCIAL</a>
<a href="agricultural/index.html">AGRICULTURAL</a>
<a href="residential/index.html">RESIDENTIAL</a>
<a href="pool/index.html">POOL HEATING</a>
</div>

By default all you should do is create a blank DIV:

<div class="pagination" id="paginate-slider1"></div>

In which the script then populates dynamically based on your custom link text and real URLs. This is possibly the source of your problem.

I've attached an entire working example of Featured Content script, with the fading effect, real URLs, plus disabling of the next button.

p.s: Please don't start a new thread on an existing question. Instead, just reply to the already existing one. I've gone ahead and deleted your new thread "Featured Content Slider - real url+fade (again)".

[mamaduck]

Thanks so much, everything works exactly as I need it to ... until I try to move the pagination links to above the content div(s). I'm trying to figure this out and will search the forum for answers, but if anyone one happens to know why this happens and how to avoid it, let me know.

[mamaduck]

In the test file that you posted above, it still works when I put the pagination links on top, so obviously it is something in my html or css that is causing the breakdown when I put the pagination links on top. I will try to pinpoint what the problem is.