Thanks a lot! Never knew the order mattered.
On Wednesday, 4 July 2012 16:08:51 UTC+8, Barry vd. Heuvel wrote: > > Include jQuery first, before bootstrap code. > > (Rest of your codes works in this fiddle; http://jsfiddle.net/ceUhm/ ) > > On Wed, Jul 4, 2012 at 9:27 AM, Chun Hui Tan <[email protected]>wrote: > >> I'm new to bootstrap, using tabs that are not responding to button >> clicks, and have no idea what's gone wrong. >> >> <!DOCTYPE html> >> <html lang="en"> >> <head> >> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> >> <title>View location</title> >> <link rel="stylesheet" href="stylesheets/bootstrap.css"> >> <link rel="stylesheet" href="stylesheets/bootstrap-responsive.css"> >> >> <script type="text/javascript" src="javascripts/bootstrap.js"></script> >> <script type="text/javascript" >> src="javascripts/bootstrap-tab.js"></script> >> <script type="text/javascript" src=" >> http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script> >> >> <script type="text/javascript"> >> $(function() { >> $('#tabs a').click(function(e){ >> e.preventDefault(); >> $(this).tab('show'); >> }); >> }); >> </script> >> >> </head> >> >> <body> >> <div id="content" class="container-fluid" style="height: inherit"> >> <div class="row-fluid" style="height:inherit;"> >> <div class="span3" style="height:inherit"> >> <div class="well sidebar-nav" style="height:inherit"> >> <ul class="nav nav-tabs" id="tabs" > >> <li class="active"><a href="#location" >> data-toggle="tab">Location</a></li> >> <li><a href="#event" data-toggle="tab">Events</a></li> >> </ul> >> >> <div class="tab-content"> >> <div class="tab-pane active" id="location">location</div> >> <div class="tab-pane" id="event">event</div> >> </div> >> </div> >> </div> >> </body> >> </html> >> >> >> Any help is appreciated. Thanks >> >> > >
