Site News
Warning: This wiki contains spoilers. Read at your own risk!

Social media: If you would like, please join our Discord server, and/or follow us on X (Twitter) or Tumblr!

MediaWiki:Tabs.js: Difference between revisions

From Fire Emblem Wiki, your source on Fire Emblem information. By fans, for fans.
No edit summary
m ("tab_tab" sounds dumb, but whatever)
 
(2 intermediate revisions by one other user not shown)
Line 8: Line 8:


$(document).ready(function(){
$(document).ready(function(){
  // When a tab is clicked
// When a tab is clicked
  $(".tab").click(function () {
$(".tab_tab").click(function () {
    var $siblings = $(this).parent()children();
var $siblings= $(this).parent().children();
    var $alltabs = $(this).closest(".tabcontainer");
var $alltabs = $(this).closest(".tabcontainer");
    var $content = $alltabs.parent().children(".tabcontents");
var $content = $alltabs.parent().children(".tabcontents");
 
    // switch all tabs off
// switch all tabs off
    $siblings.removeClass("tabselected");
$siblings.removeClass("tabselected");
 
    // switch this tab on
// switch this tab on
    $(this).addClass("tabselected");
$(this).addClass("tabselected");
 
    // hide all content
// hide all content
    $content.children(".content").css("display","none");
$content.children(".tab_content").css("display","none");
 
    // show content corresponding to the tab
// show content corresponding to the tab
    var index = $siblings.index(this);
var index = $siblings.index(this);
    $content.children().eq(index).css("display","block");
$content.children().eq(index).css("display","block");
  });
});
});
});

Latest revision as of 15:41, 23 January 2019

/*
	Simple but flexible javascript tabs
	v0.3
	Author: Abdullah A. Abduldayem
	Contact: http://www.zeldawiki.org/User:Abdullah
	See http://www.zeldawiki.org/MediaWiki_talk:Tabs.js for examples and documentation
*/

$(document).ready(function(){
	// When a tab is clicked
	$(".tab_tab").click(function () {
		var $siblings= $(this).parent().children();
		var $alltabs = $(this).closest(".tabcontainer");
		var $content = $alltabs.parent().children(".tabcontents");
		
		// switch all tabs off
		$siblings.removeClass("tabselected");
		
		// switch this tab on
		$(this).addClass("tabselected");
		
		// hide all content
		$content.children(".tab_content").css("display","none");
		
		// show content corresponding to the tab
		var index = $siblings.index(this);
		$content.children().eq(index).css("display","block");
	});
});