rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-01-18 10:52:19 +01:00
Code Issues Actions Packages Releases Activity

docs: #myTab => #myTabs, to slightly increase clarity

Browse Source
This commit is contained in:
Chris Rebert 2015-03-25 17:39:44 -07:00
parent 2f3076f20a
commit 1bafd4c829
1 changed files with 8 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
docs/_includes/js/tabs.html
View File

@ -4,7 +4,7 @@
<h2 id="tabs-examples">Example tabs</h2> <h2 id="tabs-examples">Example tabs</h2>
<p>Add quick, dynamic tab functionality to transition through panes of local content, even via dropdown menus.</p> <p>Add quick, dynamic tab functionality to transition through panes of local content, even via dropdown menus.</p>
<div class="bs-example bs-example-tabs" role="tabpanel" data-example-id="togglable-tabs"> <div class="bs-example bs-example-tabs" role="tabpanel" data-example-id="togglable-tabs">
<ul id="myTab" class="nav nav-tabs" role="tablist"> <ul id="myTabs" class="nav nav-tabs" role="tablist">
<li role="presentation" class="active"><a href="#home" id="home-tab" role="tab" data-toggle="tab" aria-controls="home" aria-expanded="true">Home</a></li> <li role="presentation" class="active"><a href="#home" id="home-tab" role="tab" data-toggle="tab" aria-controls="home" aria-expanded="true">Home</a></li>
<li role="presentation"><a href="#profile" role="tab" id="profile-tab" data-toggle="tab" aria-controls="profile">Profile</a></li> <li role="presentation"><a href="#profile" role="tab" id="profile-tab" data-toggle="tab" aria-controls="profile">Profile</a></li>
<li role="presentation" class="dropdown"> <li role="presentation" class="dropdown">
@ -41,7 +41,7 @@
<p>Enable tabbable tabs via JavaScript (each tab needs to be activated individually):</p> <p>Enable tabbable tabs via JavaScript (each tab needs to be activated individually):</p>
{% highlight js %} {% highlight js %}
$('#myTab a').click(function (e) { $('#myTabs a').click(function (e) {
e.preventDefault() e.preventDefault()
$(this).tab('show') $(this).tab('show')
}) })
@ -50,10 +50,10 @@ $('#myTab a').click(function (e) {
<p>You can activate individual tabs in several ways:</p> <p>You can activate individual tabs in several ways:</p>
{% highlight js %} {% highlight js %}
$('#myTab a[href="#profile"]').tab('show') // Select tab by name $('#myTabs a[href="#profile"]').tab('show') // Select tab by name
$('#myTab a:first').tab('show') // Select first tab $('#myTabs a:first').tab('show') // Select first tab
$('#myTab a:last').tab('show') // Select last tab $('#myTabs a:last').tab('show') // Select last tab
$('#myTab li:eq(2) a').tab('show') // Select third tab (0-indexed) $('#myTabs li:eq(2) a').tab('show') // Select third tab (0-indexed)
{% endhighlight %} {% endhighlight %}
<h3>Markup</h3> <h3>Markup</h3>
@ -97,7 +97,7 @@ $('#myTab li:eq(2) a').tab('show') // Select third tab (0-indexed)
Activates a tab element and content container. Tab should have either a <code>data-target</code> or an <code>href</code> targeting a container node in the DOM. Activates a tab element and content container. Tab should have either a <code>data-target</code> or an <code>href</code> targeting a container node in the DOM.
</p> </p>
{% highlight html %} {% highlight html %}
<ul class="nav nav-tabs" role="tablist" id="myTab"> <ul class="nav nav-tabs" role="tablist" id="myTabs">
<li role="presentation" class="active"><a href="#home" aria-controls="home" role="tab" data-toggle="tab">Home</a></li> <li role="presentation" class="active"><a href="#home" aria-controls="home" role="tab" data-toggle="tab">Home</a></li>
<li role="presentation"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">Profile</a></li> <li role="presentation"><a href="#profile" aria-controls="profile" role="tab" data-toggle="tab">Profile</a></li>
<li role="presentation"><a href="#messages" aria-controls="messages" role="tab" data-toggle="tab">Messages</a></li> <li role="presentation"><a href="#messages" aria-controls="messages" role="tab" data-toggle="tab">Messages</a></li>
@ -113,7 +113,7 @@ $('#myTab li:eq(2) a').tab('show') // Select third tab (0-indexed)
<script> <script>
$(function () { $(function () {
$('#myTab a:last').tab('show') $('#myTabs a:last').tab('show')
}) })
</script> </script>
{% endhighlight %} {% endhighlight %}