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 > >
