Ich versuche es mal ein wenig zu dokumentieren.
Das hier ist der Part aus dem Theme.
Es löscht einfach bei einem Klick auf ein Element immer alle Vorkommnisse von der Klasse „active“ und setzt sie bei dem Element was angeklickt wurde.
/*----------------------------------------------
T A B S
------------------------------------------------*/
jQuery(".tabs").each(function (i) {
jQuery(this).find('.tab_content').removeClass('active');
var rel = jQuery(this).find('.active').attr('href');
jQuery(this).find('.' + rel).addClass('active');
});
jQuery(".tab_nav").on("click", "a", function () {
var parentdiv = jQuery(this).parent('li').parent('ul').parent('div');
var rel = jQuery(this).attr('href');
jQuery(parentdiv).find(".tab_nav a").removeClass("active");
jQuery(this).addClass("active");
jQuery(parentdiv).find(".tab_container .tab_content").hide().removeClass('active');
jQuery(parentdiv).find(".tab_container ." + rel).fadeIn(500).addClass('active');
return (false);
});
Diese Funktion liest den URL-Parameter aus, der angegeben wird als Parameter der Funktion.
function get_url_param(name) {
name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
var regexS = "[\\?&]" + name + "=([^&#]*)";
var regex = new RegExp(regexS);
var results = regex.exec(window.location.href);
if (results == null) return "";
else return results[1];
}
Jetzt wird es spannend:
Wenn überhaupt ein URL-Parameter vorhanden ist (ungleich leerer String):
if (window.location.search != "") {
Speichere den Inhalt des Parameters „tabid“ in der Variable „tabid“.
var tabid = get_url_param('tabid');
Entferne alle Vorkommnisse von der Klasse „active“ in der Navi.
jQuery(".tab_nav a").removeClass("active");
Und ergänze es wieder bei dem Link mit Klasse tabid gefolgt von der Zahl aus dem URL-Parameter.
jQuery("[href='tabid" + tabid + "']").addClass("active");
Und das gleiche nochmal für den Container mit dem Inhalt, aber den Inhalt dabei einblenden (500 Millisekunden Animation: FadeIn).
jQuery(".tab_container .tab_content").hide().removeClass('active');
jQuery(".tabid" + tabid).fadeIn(500).addClass('active');
}
Fertig!
Gruß, Torsten
