Sunday 15 June 2014

jquery - horizontal accordion tutorial css issue i think -


I am following this tutorial on how I have gone through the horizontal coordinate code and that's OK. What is my problem? I think that is my CSS, when you click on a tab, the animations are animated in the last panel, but the next panel is dropped and does not do the etmat, someone can show me what is wrong , Either in my CSS or JPER Please give me some help for this. Please here is mine. I do not know what exactly is the problem, but I run all my elements on the left.

PS 'visible' variable is the current content panel html:

    

CSS

  .accordion {width: 460px; Height: 300px} .accordion .header {width: 40px; Height: 100%} .accordion .content {background: #dedede; Height: 100%} .accordion Title, accordion .content {float: left; Height: 100%; Clear: none} # Tab 1 {Background: # C90} # Tab 2 {Background: # C60} # Tab 3 {Background: # C30} # Tab 4 {Background: # C00}   < P> jQuery: <(': last'), width (':' '' 'H3' ',' visible '). = Visible.outwidth (); Tab.next () Filter (': no ​​(: last)'). CSS ({'display': 'none,' width ': 0}); Tab.click (function () {if (visible.prev () [0] == this) {return;} visible.animate ({width: 0}, {duration: rate}); visible = $ (this) Next (). Chetan ({'width': width}, {duration: rate});}; } Ardiion (350);    

Sorry I do not have enough reputation to comment on this.

Did you compare your code with the linked source code in the comment of the tutorial video?

There are some important differences in your original post, the jacquery is different from your JSfield.

Your jazzery should look even more:

  function erordian (rate) {var tab = $ ('.accordion'). ('Header'), visible = tab. New (). Filter (': the last'), width = visible.outerWidth (); Tab.next () Filter (': no ​​(: last)'). CSS ({'display': 'none,' width ': 0}); Tab.click (function () {if (visible.prev () [0] == this) {return;} visible.animate ({width: 0}, {duration: rate}); visible = $ (this) Next (). Animate ({width: width}, {duration: rate});}); }; $ (Document) .ready (function () {accordion (350);});    

No comments:

Post a Comment