jquery tabs
30.05.2011

The task is to make tabs in jquery.
<script type="text/javascript"> $(function() { $("div.tabcontent ul.tabNavigation li:last").css("border-right", "0").css("width", "87px"); var tabContainers = $('div.tabcontent div.tabs-cont div'); // Replace all divs in .tabs-cont with a variable. tabContainers.hide().filter(':first').show(); // On load, hide these divs except for the first one. $('div.tabcontent ul.tabNavigation a').click(function () { // Action happens when the link is clicked. tabContainers.hide(); // Hide all divs. tabContainers.filter(this.hash).fadeIn("slow"); // Smoothly develop the block with the id specified in the href of the link. $('div.tabcontent ul.tabNavigation a').removeClass('selected'); // Remove the selected class from all links. $(this).addClass('selected'); // Add the selected class to the clicked link. return false; }).filter(':first').click(); // On load, automatically assign the selected class to the first link. });
Operation algorithm: Sections (li) in the ".tabNavigation" block are assigned a class when clicked, which will change the background color. The content of ".tabs-cont" will smoothly change its transparency from hide to 1.0. jquery is in the code and is not intrusive javascript code.
SUBSCRIBE TO NEWSLETTER
Last in our blog
Internet Marketing
04.11.2019
Internet Marketing
03.10.2019