I'm trying to create a javscript scroller following the example at: http://www.deadmarshes.com/Blog/jQuery+ ... sfade.html Unfortunately this version doesn't show anything when javascript is disabled but I'd like it to at least show the first image and caption and then just not move. I stuck together a fiddle http://jsfiddle.net/Lew7H/8/ Does anyone know how to make the initial transition not happen and just have the first 'slide' there? Also I adapted this slightly to show 4 slides instead of 3. I changed 3 to 4 in two places in the JS (where it's keeping tally) and that seemed to work alright but now in FF when you click on a few of the numbers to change slides a few times then let it go back to normal running, the indicator which is meant to show which slide you're on starts appearing all over the place. The timing of the transitions also goes weird. It's like clicking a couple of times means the transitions and the pointers are going a couple of times. IE there's more than one bit of JS moving the slides and pointers, resulting in strangly timed transitions and more than one pointer. Could that be possible? I assume that's to do with the way it's being counted in the JS but I haven't a clue what it's doing to be honest. Any help would be appreciated.
Hey there, thanks for the reply. Yeah, I've since figured that bit out but I'm still stuck with how when you click one of the indicators then when transitions resume they aren't at regular intervals and there is often more than one indicator active at the same time. any ideas?
Indicators are generated by JavaScript, that'll be easy to listen the mouse events. When an indicator is clicked, you should set the active indicator inactive, and set the clicked one active, or you'll get two, mess. At the same time, you should call clearInterval when any indicator is clicked. I've wrote a series a year ago, and some demos as well. Part 2 of the series is about degradation and enhancement, exactly what you're looking for. It's written in Chinese, maybe not helping, but you can read the codes, hosted on GitHub. https://github.com/forcefront/jquery-slider I also wrote a slider just like what you said — functional when JS is on, and show only one picture when it's off. It was a mobile website so degradation is very important, because there are still feature phones. I'll not paste the source code, it's a job behavior, but that the reason I wrote the series. Good luck.