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

Enter image details (

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;  fly on pink flower  & 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

Popular posts from this blog

Verilog Error: output or inout port "Q" must be connected to a structural net expression -

jasper reports - How to center align barcode using jasperreports and barcode4j -

c# - ASP.NET MVC - Attaching an entity of type 'MODELNAME' failed because another entity of the same type already has the same primary key value -