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.
mNo edit summary
m (http://zeldawiki.org/index.php?title=MediaWiki:Tabs.js&direction=prev&oldid=309918)
Line 1: Line 1:
/*
/*
Simple but flexible javascript tabs
Simple but flexible javascript tabs
v0.3
Author: Abdullah A. Abduldayem
Author: Abdullah A. Abduldayem
Contact: http://www.zeldawiki.org/User:Abdullah
Contact: http://www.zeldawiki.org/User:Abdullah
Line 6: Line 7:
*/
*/


function ShowTab(id,num,total) {
$(document).ready(function(){
document.getElementById('_'+id+num).style.display='block';
  // When a tab is clicked
  $(".tab").click(function () {
if (document.getElementById(id+num).className != 'tab tabselected')
    var $siblings  = $(this).parent()children();
document.getElementById(id+num).className+=' tabselected';
    var $alltabs = $(this).closest(".tabcontainer");
    var $content = $alltabs.parent().children(".tabcontents");


for(var i=0;i<=total;i++)
    // switch all tabs off
{
    $siblings.removeClass("active");
if(i!=num)
{
document.getElementById('_'+id+i).style.display='none'
document.getElementById(id+i).className = document.getElementById(id+i).className.replace(/\b tabselected\b/,'')
}
}
}


function tabstart() {
    // switch this tab on
tabcontainer = getElementsByClassName(document, '*', 'tabcontainer');
    $(this).addClass("active");
tabcontents = getElementsByClassName(document, '*', 'tabcontents');


for(var x=0; x<=tabcontainer.length -1; x++) {
    // hide all content
tabcontainer[x].id = "tab-" + x + "-";
    $content.children(".content").css("display","none");
tabs = getElementsByClassName(tabcontainer[x], '*', 'tab');
contents = tabcontents[x].childNodes;


var is_ie = ((clientPC.indexOf('msie') != -1) && (clientPC.indexOf('opera') == -1));
    // show content corresponding to the tab
if(is_ie){
    var index = $siblings.index(this);
for(var y=0; y<=tabs.length -1; y++) {
    $content.children().eq(index).css("display","block");
tabs[y].setAttribute('id', tabcontainer[x].id + y);
  });
tabs[y].setAttribute('onclick', "ShowTab('" + tabcontainer[x].id + "'," + y + "," + (tabs.length -1) + ");");
});
contents[y].setAttribute('id', '_' + tabcontainer[x].id + y);
if (!contents[y].style.display)
{contents[y].setAttribute('style', "display:none;");}
}
}
else{
for(var y=0; y<=tabs.length -1; y++) {
tabs[y].setAttribute('id', tabcontainer[x].id + y);
tabs[y].setAttribute('onclick', "ShowTab('" + tabcontainer[x].id + "'," + y + "," + (tabs.length -1) + ");");
contents[y*2 +1].setAttribute('id', '_' + tabcontainer[x].id + y);
if (!contents[y*2 +1].style.display)
{contents[y*2 +1].setAttribute('style', "display:none;");}
}
}
 
}
}
addOnloadHook(tabstart);

Revision as of 16:47, 3 May 2014

/*
	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").click(function () {
    var $siblings  = $(this).parent()children();
    var $alltabs = $(this).closest(".tabcontainer");
    var $content = $alltabs.parent().children(".tabcontents");

    // switch all tabs off
    $siblings.removeClass("active");

    // switch this tab on
    $(this).addClass("active");

    // hide all content
    $content.children(".content").css("display","none");

    // show content corresponding to the tab
    var index = $siblings.index(this);
    $content.children().eq(index).css("display","block");
  });	
});
Retrieved from "https://fireemblemwiki.org/w/index.php?title=MediaWiki:Tabs.js&oldid=55100"