Hi,
I have a tabbed content area which toggles using bootstrap. This works fine, but I also have a form which uses a variable... var id_form = 35;
What I would like to do is change this variable number depending on what content is active. So, if a certain css class exsists the number with change accordingly. Is this even possible??
Here is some code to help demonstrate what I mean:
HTML Code:<div class="container products"> <div class="tab-pane" id="tabs-side"> <div class="tabbable tabs-left"> <ul class="nav nav-tabs span2"> <li class="active"><a href="#tabs2-pane1" data-toggle="tab">Double Glazing</a></li> <li><a href="#tabs2-pane2" data-toggle="tab">Triple Glazing</a></li> <li><a href="#tabs2-pane3" data-toggle="tab">uPVC Doors</a></li> <li><a href="#tabs2-pane4" data-toggle="tab">Bifold Doors</a></li> <li><a href="#tabs2-pane5" data-toggle="tab">Secondary Glazing</a></li> </ul> <div class="tab-content span5"> <div id="tabs2-pane1" class="tab-pane active"> <h4>Double Glazing</h4> <p>Reduce your annual heating bills by up to £300 a year and keep your home warmer in the winter with double glazed windows. Double glazing retains heat, ensuring you don't have to turn up the boiler's temperature to keep warm. On top of this, cut your home's carbon emissions by as much as 680kg a year too.<br /></p> <div style="float:left; border: 1px solid #eee;"><img src="./images/double-glazing.jpg" alt="Double Glazing"> </div> </div> <div id="tabs2-pane2" class="tab-pane"> <h4>Triple Glazing</h4> <p>Save even more money on your energy bills with triple glazing, whilst improving security and cutting home carbon emissions. Triple glazing prevents heat from escaping your home, making sure you don’t have to up the boiler's temperature to keep warm. Make your home more efficient and cut bills throughout the year.</p> <div style="float:left; border: 1px solid #eee;"><img src="./images/triple-glazing.jpg" alt="Triple Glazing"> </div> </div> <div id="tabs2-pane3" class="tab-pane"> <h4>uPVC Doors</h4> <p>uPVC has become the most popular external door material for a number of reasons, including energy efficiency and security. 20-25% of heat is lost through doors and windows so insulate your home and cut energy bills with a sturdy uPVC door. You'll even improve security with the latest locking mechanisms, giving you greater peace of mind.</p> <div style="float:left; border: 1px solid #eee;"><img src="./images/upvc-doors.jpg" alt="uPVC Doors"> </div> </div> <div id="tabs2-pane4" class="tab-pane"> <h4>Bifold Doors</h4> <p>Create an elegant feel and make the most of your home's space with bifolding doors. Door panels are connected by centralised hinges, allowing you to fold the unit together and push to one side. This ease of operation makes them perfect for conservatories and the variety of styles means there's something suitable for every home.</p> <div style="float:left; border: 1px solid #eee;"><img src="./images/bifold-doors.jpg" alt="Bifold Doors"> </div> </div> <div id="tabs2-pane5" class="tab-pane"> <h4>Secondary Glazing</h4> <p>Benefit from reduced energy bills even if you live in a Conservation Area or listed building. Secondary glazing acts as an extra barrier to retain heat in the property, improving your home security and cutting noise pollution. A second pane is fitted on the inside of the original unit and this can help you slash bills by hundreds of pounds annually.</p> <div style="float:left; border: 1px solid #eee;"><img src="./images/secondary-glazing.jpg" alt="Secondary Glazing"> </div> </div> <div id="form" style="float:left; color:#000; font:Arial, Helvetica, sans-serif;"> <script type="text/javascript"> </script> <script type="text/javascript"> var id_site = 362; var id_form = 35; var width = 535; var bgcolor = 'transparent'; var font_size = '11px'; var font_family_global = 'Verdana,Arial'; var font_family_title = 'Verdana,Arial'; var font_family_input = 'Verdana,Arial'; var font_color_global = '#333'; var font_color_title = '#343434'; var font_color_input = '#3A3A3A'; var font_color_radiocheck = '#666'; var bgcolor_rollover = '#cce9f9'; var intro = 0; var no_infobox = 0; var scenario_no_header = 0; var onestep = 1; var no_footer = 0; var bgcolor_rollover = '#cce9f9'; var intro = 0; var no_infobox = 1; var scenario_no_header = 1; var onestep = 0; var no_footer = 1; var scenario_no_header=1 var no_progressbar=1 var font_color_title = 'transparent; background:none'; var scenario_color_title ='transparent'; var bgcolor = 'transparent'; </script>


Reply With Quote
Bookmarks