Trying to have a Featured Content Slider Code made that it highly customizable

Quote:

---

Originally Posted by jscheuer1

I've been busy getting ready but for now the power is still on. I've also found time to get started with this project. The slider itself does all of those things except for animating the thumbnails onmouseover of arrows. But the transitions in the detail area aren't as smooth or fancy. I plan on using jQuery both to allow for the scrolling of the thumbnails and to smooth out and enhance the transitions in the detail area.

---

Sounds like a plan. I am glad that your power didn't go out and that you're safe. I wouldn't wish that on anyone. I am in shock at how much damageit has done.

Yes we in our immediate area here were very lucky, thanks.

OK, it's done, tested in Chrome IE 8, 9, Firefox, and Opera. To give you an idea, here's the new on page init with added/changed capabilities highlighted:

Code:

---

jQuery(function($){
        featuredcontentslider.init({
                id: "slider4",  //id of main slider DIV
                contentsource: ["inline", ""], //Valid values: ["inline", ""] or ["ajax", "path_to_file"]
                toc: "markup", //Valid values: "#increment", "markup", ["label1", "label2", etc]
                nextprev: ["", "Next"], //labels for "prev" and "next" links. Set to "" to hide.
                revealtype: "click", //Behavior of pagination links to reveal the slides: "click" or "mouseover"
                enablefade: [true, 1000], //[true/false, fadeduration] (meaning of second param changed, still added to pausetimr)
                slidespeed: 300, //duration of text slide down effect (new) (will be added to pausetime)
                autorotate: [true, 3000], //[true/false, pausetime]
                linktarget: "_new", //Target for detail links generated from toc links (new)
                mouseoverpause: true, //Should auto mode pause on mouseover of detail? (new)
                arrows: {left:'#leftarrow', right:'#rightarrow'}, //jQuery selectors for arrow images (new)
                thumbspeed: 2500, //Duration of thumbnail slider motion from one end to the other (new)
                onChange: function(previndex, curindex){  //event handler fired whenever script changes slide
                        //previndex holds index of last slide viewed b4 current (1=1st slide, 2nd=2nd etc)
                        //curindex holds index of currently shown slide (1=1st slide, 2nd=2nd etc)
                }
        });
});

---

And a screenshot:
http://home.comcast.net/~jscheuer1/s...tentslider.jpg

The CSS and HTML are as well documented/commented as the above init code, and I will be happy to explain anything you don't understand.

To get the actual code and a working demo, please send the balance, $75.00 US to:

http://home.comcast.net/~jscheuer1/side/donate.htm

That will include a reasonable amount of tweaking/support.

I sent it. Thank you. I look forward to it.

Thank You, I will PM you the links. Any questions, ask here.

How do I adjust the scroll speed?I am having a problem finding it.

Hi, I am back for one quick question. I finally had time to customize this but for some reason when I did I screwed up the slider. Can you show me where I messed it up and how to fix it?

http://www.escapebetweenthepages.com...emo_scroll.htm

Are you refering to the size/shape of thr smaller thumbnails?

I made a few adjustments to the slider here http://www.web-user.info/test/slider/demo_scroll.htm

But the arrows do not work as far as moving forward or backwards with the images.I have to leave that up to John.I don't know jquery at all.But it does still rotate through the images.

I am wondering what I did to make it not scroll anymore. :(

You need to get with John again? Didn't he do the script for you?

I am sure if he did so it will be an easy fix for him.I like the appearance of the script-nice.