Grüße,
Willst du das wirklich? Wieso? Ich glaube, du suchst etwas ganz anderes.
zumindest scheint es mir eine gute idee - ich wollte ein objekt mit ein paar methoden erstellen, die auch noch obendrauf als eventHandler verfügbar sein sollten. oder zumidnest eigenschaften von.
//bekommt calsse der divs die als tabs zusammengefasst werden sollen
function tabSet(c){
var targetClass=c;
//klassen für aktive/inaktive tab-schlater/reiter
var activeR="fgReiter";
var inactiveR="bgReiter";
var tabs=document.body.getElementsByClassName(targetClass);
//alle ausblenden
function hidetabs(){
for(i=0;i<tabs.length;i++){
tabs[i].style.display="none";
}
//reiter gleich mit
for(i=0;i<reiter.length;i++){
//activeklasse?weg damit
e.target.classList.toggle(inactiveR);
e.target.classList.toggle(activeR);
}
}
//by ID
this.showTab=function(e){
//bekommt id (expliziter aufruf) oder click-event des reiters
var id;
if(typeof(e)=="string"){
id=e;
for(i=0;i<reiter.length;i++){
if(reiter[i].dataset["target"]==id){
reiter[i].classList.toggle(inactiveR);
reiter[i].classList.toggle(activeR);
}
}
}else{
id=e.target.dataset["target"];
//reiter wurde angeklikt - aktive klasse zuweisen
e.target.classList.toggle(inactiveR);
e.target.classList.toggle(activeR);
}
gid(id).style.display="block";
}
//erstellt die UL mit den "reitern"
function makeList(){
var tabList=document.createElement("ul"),li;
//die über class angewählten tabs ollten über data-title ihren titel
//mitteilen und eine id haben, die dem titel entspricht
for(i=0;i<tabs.length,t=tabs[i];i++){
li=html.li(t.dataset["title"]);
li.addEventListener("click",
function(e){
hidetabs();
showTab(e);
//PROBLEMSTELLE
//zugriff auf die variablen activeR/inactiveR notwendig,um dem aktiven tab richtige klasse zu geben
}
,false);
li.dataset["target"]=t.id;
li.classList.add(inactiveR);
tabList.appendChild(li);
}
tabList.id=targetClass+"TabList";
tabList.className="tabSetReiterleiste";
return tabList;
}
var reiter=makeList();
//die reiterliste als erste in das elternelement der tabs einfügen
tabs[0].parentNode.insertBefore(reiter, tabs[0].parentNode.firstChild);
//ersten tab+reiter zeigen
hidetabs();
this.showTab(tabs[0].id);
}
http://molily.de/js/organisation-instanzen.html
http://molily.de/js/organisation-verfuegbarkeit.html
Mathias
danke -
ich konzentriere mich drauf- die kropffseite scheint ein paar misscverständnisse zu zugen.
MFG
bleicher