Hi, I am working on a js slider from scratch. I now I can just download a nivo slider or one of the slider on CodeCanyon, but I want to make one from scratch, with my own noggin’, and a little of your expertise
So here is my code so far.
the css
.slideshow {
position: relative;
display: block;
list-style: none;
top: 0px;
left: 0px;
margin:0;
padding:0;
width: 570px;
height: 270px;
}
.slideshow ul {
position: relative;
top: 0px;
left: 0px;
width: 570px;
height: 270px;
}
.slideshow li {
position: absolute;
top: 0px;
left: 0px;
float: left;
z-index: 100;
}
.slideshow li.current {
position: absolute;
top: 0px;
left: 0px;
float:left;
z-index: 9999;
}
Now the javascript I was thinking of using a “window.setInterval(yourfunction, 10000);” then do something with the opacity do ”$(‘ul.slideshow li’).css({opacity: 0.0});” then ”$(‘ul.slideshow li.current’).css({opacity: 1.0}).addClass(‘show’);”
so right now it’ll look like this
window.setInterval('gallery()', 2000);
$('ul.slideshow li').css({opacity: 0.0});
$('ul.slideshow li.current').css({opacity: 1.0}).addClass('show');
It’s not working though, I know I have to use a timer function that removes the “current” class and adds that class to the next image in line. But I can’t seem to figure all the stuff you gotta do so it all comes together and works properly. So that’s why I need your help. Sorry if I am not clear enough on what I am asking.
Thanks in advance!
