From 2f06366399f1b0572b0dbcbadcf06df9e4867f2b Mon Sep 17 00:00:00 2001 From: Marcus Bointon Date: Wed, 21 Mar 2012 12:09:00 +0100 Subject: Make changes in page templates, rebuild --- docs/templates/pages/javascript.mustache | 13 +++++++++---- 1 file changed, 9 insertions(+), 4 deletions(-) (limited to 'docs/templates/pages/javascript.mustache') diff --git a/docs/templates/pages/javascript.mustache b/docs/templates/pages/javascript.mustache index 7fd4c98d0..b61a0d424 100644 --- a/docs/templates/pages/javascript.mustache +++ b/docs/templates/pages/javascript.mustache @@ -562,8 +562,13 @@ $('#myModal').on('hidden', function () {

{{_i}}Using bootstrap-tab.js{{/i}}

{{_i}}Enable tabbable tabs via javascript:{{/i}}

$('#myTab').tab('show')
+

{{_i}}You can also activate a specific tab (or a pseudo-selected one) on init:{{/i}}

+
+$('#myTab a[href="#profile"]').tab('show');
+$('#myTab a:last').tab('show');
+

{{_i}}Markup{{/i}}

-

{{_i}}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.{{/i}}

+

{{_i}}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.{{/i}}

 <ul class="nav nav-tabs">
   <li><a href="#home" data-toggle="tab">{{_i}}Home{{/i}}</a></li>
@@ -577,7 +582,7 @@ $('#myModal').on('hidden', function () {
             {{_i}}Activates a tab element and content container. Tab should have either a `data-target` or an `href` targeting a container node in the dom.{{/i}}
           

-<ul class="nav nav-tabs">
+<ul class="nav nav-tabs" id="myTab">
   <li class="active"><a href="#home">{{_i}}Home{{/i}}</a></li>
   <li><a href="#profile">{{_i}}Profile{{/i}}</a></li>
   <li><a href="#messages">{{_i}}Messages{{/i}}</a></li>
@@ -593,7 +598,7 @@ $('#myModal').on('hidden', function () {
 
 <script>
   $(function () {
-    $('.tabs a:last').tab('show')
+    $('#myTab a:last').tab('show')
   })
 </script>

{{_i}}Events{{/i}}

@@ -817,7 +822,7 @@ $('a[data-toggle="tab"]').on('shown', function (e) {

{{_i}}Markup{{/i}}

- {{_i}}For performance reasons, the Tooltip and Popover data-apis are opt in. If you would like to use them just specify a the selector option.{{/i}} + {{_i}}For performance reasons, the Tooltip and Popover data-apis are opt in. If you would like to use them just specify a selector option.{{/i}}

{{_i}}Methods{{/i}}

$().popover({{_i}}options{{/i}})

-- cgit v1.2.3 From cfce34e3000b2c02549e3af280668afea61fa752 Mon Sep 17 00:00:00 2001 From: Marcus Bointon Date: Thu, 22 Mar 2012 20:36:49 +0100 Subject: Add more examples for activating tabs Make naming of tab id consistent --- docs/templates/pages/javascript.mustache | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) (limited to 'docs/templates/pages/javascript.mustache') diff --git a/docs/templates/pages/javascript.mustache b/docs/templates/pages/javascript.mustache index b61a0d424..925377339 100644 --- a/docs/templates/pages/javascript.mustache +++ b/docs/templates/pages/javascript.mustache @@ -533,7 +533,7 @@ $('#myModal').on('hidden', function () {

{{_i}}Example tabs{{/i}}

{{_i}}Click the tabs below to toggle between hidden panes, even via dropdown menus.{{/i}}

-

{{_i}}Using bootstrap-tab.js{{/i}}

-

{{_i}}Enable tabbable tabs via javascript:{{/i}}

-
$('#myTab').tab('show')
-

{{_i}}You can select individual tabs in several ways:{{/i}}

+

{{_i}}Enable tabbable tabs via javascript (each tab needs to be activated individually):{{/i}}

+
+$('#myTab a').click(function (e) {
+  e.preventDefault();
+  $(this).tab('show');
+})
+

{{_i}}You can activate individual tabs in several ways:{{/i}}

 $('#myTab a[href="#profile"]').tab('show'); //Select tab by name
 $('#myTab a:first').tab('show'); //Select first tab
-- 
cgit v1.2.3


From 0e73a0e94b70eab01ca0cafbec48a892531304af Mon Sep 17 00:00:00 2001
From: Mark Otto 
Date: Thu, 22 Mar 2012 17:09:54 -0700
Subject: change spacing and fix code blocks

---
 docs/templates/pages/javascript.mustache | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

(limited to 'docs/templates/pages/javascript.mustache')

diff --git a/docs/templates/pages/javascript.mustache b/docs/templates/pages/javascript.mustache
index c6d1f403c..01fcb9761 100644
--- a/docs/templates/pages/javascript.mustache
+++ b/docs/templates/pages/javascript.mustache
@@ -568,10 +568,10 @@ $('#myTab a').click(function (e) {
 })

{{_i}}You can activate individual tabs in several ways:{{/i}}

-$('#myTab a[href="#profile"]').tab('show'); //Select tab by name
-$('#myTab a:first').tab('show'); //Select first tab
-$('#myTab a:last').tab('show'); //Select last tab
-$('#myTab li:eq(2) a').tab('show'); //Select third tab (0-indexed)
+$('#myTab a[href="#profile"]').tab('show'); // Select tab by name
+$('#myTab a:first').tab('show'); // Select first tab
+$('#myTab a:last').tab('show'); // Select last tab
+$('#myTab li:eq(2) a').tab('show'); // Select third tab (0-indexed)
 

{{_i}}Markup{{/i}}

{{_i}}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.{{/i}}

@@ -585,7 +585,7 @@ $('#myTab li:eq(2) a').tab('show'); //Select third tab (0-indexed)

{{_i}}Methods{{/i}}

$().tab

- {{_i}}Activates a tab element and content container. Tab should have either a `data-target` or an `href` targeting a container node in the dom.{{/i}} + {{_i}}Activates a tab element and content container. Tab should have either a data-target or an href targeting a container node in the DOM.{{/i}}

 <ul class="nav nav-tabs" id="myTab">
@@ -604,7 +604,7 @@ $('#myTab li:eq(2) a').tab('show'); //Select third tab (0-indexed)
 
 <script>
   $(function () {
-    $('#myTab a:last').tab('show')
+    $('#myTab a:last').tab('show');
   })
 </script>

{{_i}}Events{{/i}}

-- cgit v1.2.3