jquery - How to modify tabbed interface? -


I have read a tutorial describing making simple tabs: but I want to modify it, and not get the desired result , And that result can be seen on a template: (just click on 'Live Preview')

So, I want a content: 1. SlideUp () and FadeOut () together 2. Slidedown () and Faden () together

I found an interesting article about a topic: But then, as I said, I do not know how to do it.

I now use code:

  (function ($) {$ .fn.slideFadeToggle = function (speed, easy, callback) {return this.animate ({opacity} : 'Toggle', height: 'toggle',}, speed, ease, callback);}} () (jQuery) $ (function () {$ ('tab-content'). Hide (); $ ('ul .tabs li: first '). AddClass (' active '); $ (' Tab-content: first ') Show (); $ (' ul.tbs lea '). Click (function () {$ ( "Ul.tabs li"). RemoveClass ("active"); $ (this) .Parent (); AddClass ('active'); $ ('tab-content'); Hide;); Var href = $ (This) .attr ('href'); $ (href) .slideFadeToggle ('slow'); the description is false;});});  

Try it:

Try it:

 

Code> (function ($) {$ .fn.slideFadeToggle = function (speed, easy, callback) {return.edimate ({opacity: 'toggle', height: 'toggle',}, speed, ease, callback);} }) (JQuery) $ (document) .ready (function () {$ ('tab-content'). Hide (); $ ('ul.tabs Li: first'). AddClass ('active'); $ ('Tab-content: first'). AddClass ('Active'). Show (); $ ('Ul.tabs li'). Click (function ($. ("Ul. Tbs lee"). Removeclass ("active"); $ (this) .addClass ('active'); var active tab = $ (this) .find ("A"). Ether ("href" '' 'Slow speed, function ($) (active tab). AndClass (' active ') SlideFoodToggle (' slow ',' '' 'function () {});}); return false; });});

Your code was still calling

  $ ('.db-content'). Hide ();  

Anything before you hide animate, you also need to use the call back function. Which means that you call the animation on the active tab content and when you have called it on the new active content.

This is working with all the basic examples that you were preventing from checking out


Comments

Popular posts from this blog

c# - ListView onScroll event -

PHP - get image from byte array -

Linux Terminal Problem with Non-Canonical Terminal I/O app -