From: Mark Otto Date: Tue, 27 Aug 2013 15:05:26 +0000 (-0700) Subject: Fixes #9991: Better docs for tabbable tabs and fade classes X-Git-Tag: v3.0.1~117 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=1445e09b5fcd8112e9753aa47c6df9c558782dd5;p=thirdparty%2Fbootstrap.git Fixes #9991: Better docs for tabbable tabs and fade classes * Adds full code snippets * Adds snippet for `.fade` * Adds callout for `.in` requirement on first fade-able tab --- diff --git a/javascript.html b/javascript.html index bb08a95565..6cebde638a 100644 --- a/javascript.html +++ b/javascript.html @@ -708,15 +708,33 @@ $('#myTab li:eq(2) a').tab('show') // Select third tab (0-indexed)

Markup

You can activate a tab or pill navigation without writing any JavaScript by simply specifying data-toggle="tab" or data-toggle="pill" on an element. Adding the nav and nav-tabs classes to the tab ul will apply the Bootstrap tab styling.

{% highlight html %} + + + +
+
...
+
...
+
...
+
...
+
{% endhighlight %} -

To make tabs fade in, add .fade to each .tab-pane.

+

Fade effect

+

To make tabs fade in, add .fade to each .tab-pane. The first tab pane must also have .in to properly fade in initial content.

+{% highlight html %} +
+
...
+
...
+
...
+
...
+
+{% endhighlight %}

Methods

$().tab