html - jQuery slider (fadeIn / fadeOut) not working correctly -
I have created a jquery slider and a user in this website has helped me improve it (adding fade transcription) Bella It used to work fine, but when I took it to my computer, then a problem arose, first of all, it is a bella.
The code is really simple, I hide the images with the display: None (hide the class) and change with fadein / fade.
$ ("active image"). FadeIn (); $ ("To hide the picture"). fadeOut (); $ ("To hide the picture"). fadeOut (); $ ("To hide the picture"). FadeOut (); And here's the problem
It increases fast for reasons of size, so if you can The problem is not seen when you click on a button, the current image closes and aprox only after 100 milliseconds. Other image weight.
I have tried .delay (), lake Neither this works either.
html
& lt ; div id = "cycler" style = "position: fixed; top: 0;" & gt; & lt; img class = "active" src = "http://www.gettyimages.com/CMS/StaticContent/1357941082241_new_banner- 700x465.jpg "alt =" green leaf on hoverfly "title =" hoverfly "width =" 506 "height =" 337 "/> on a green leaf; & Lt; img src = "http://www.menucool.com/slider/prod/image-slider-1.jpg" alt = "Insects on a leaf" title = "Platechirus granditers (I think) on a leaf" width = "506" height = "337" /> & Lt; / Div & gt; & Lt; div style = "margin-top: 350px;" & Gt; & Lt; Button onclick = "circle images (1)" & gt; 1 & lt; / Button & gt; & Lt; Button onclick = "cycle image (2)" & gt; 2 & lt; / Button & gt; & Lt; Button onclick = "Chakra Images (3)" & gt; 3 & lt; / Button & gt; & Lt; / Div & gt; css
#cycler {status: relative;} # cyclier IMG {status: absolute; z-index: 1; Background color: white} # cyclier img Active {z-index: 3} script
function cycle images (n) {var $ active = $ ('# cycler active'); Var $ next = $ ('# cycler img: nth-child (' + n + ')'); $ Next.css ('z-index', 2); $ Active.fadeOut (1500, works () {$ active.css ('z-index', 1). Show (). RemoveClass ('active'); $ next.css ('z-index', 3) AddClass ('active');}); } Bella
I like if you are looking for a flexible slide
Comments
Post a Comment