XHTMLforum - Script nur für Inhalt eines bestimmten DIVs

XHTMLforum (http://xhtmlforum.de/index.php)

- Javascript & Ajax (http://xhtmlforum.de/forumdisplay.php?f=83)

- - Script nur für Inhalt eines bestimmten DIVs (http://xhtmlforum.de/showthread.php?t=68873)

Script nur für Inhalt eines bestimmten DIVs

Hi Leute,

Habe da ein, für Euch vermutlich relativ einfach lösbares, Problem :)

Ich baue momentan eine 1-Seitige Webseite, welche per smoothscroll zu den jeweiligen Punkten scrollt (ähnliches habt Ihr bestimmt auch schon irgendwo im Web gesehen).

Am oberen Rand (fixed top) habe ich nun die Navigation, bei welcher nun natürlich der jeweilige angeklickte Navigationspunkt auch angezeigt werden soll.

Dies habe ich auch mit einem sehr simplen Script, welches ich im Web gefunden habe, gelöst. Siehe Code:

Code:

<script type="text/javascript">

function highlight(currentdiv) {

var divs = document.getElementsByTagName("div");

  for (var i = 0; i < divs.length; i++) {

       if (divs[i].id == currentdiv) {

           divs[i].style.backgroundPosition = "0px -120px";

      }

      else {

           divs[i].style.backgroundPosition = "0px 0px";

      }

  }

}

</script>

Nun habe ich allerdings das Problem dass ich ein paar Hintergrund Grafiken habe, welche mittig ausgerichtet ist.

Das Problem ist nun dass das Script nicht nur die Divs der Navigation ansteuert, sondern ALLE divs. Kurzerhand heisst dies dass sobald ich einen Navigationspunkt anklicke sämtliche Hintergrund Grafiken auf 0 0 gesetzt werden, also oben link...

Meine Frage:
Wie könnte ich das Script so anpassen dass nur die Divs innerhalb eines mir definierten Divs angesteuert würden, also zB nur die Divs welche sich innerhalb des Divs "#navigation" befänden?

Ich habe nun schon einiges durchprobiert (Google und Lösungsvorschläge ausprobiert), ende aber (da ich unglücklicherweise absolut kein JS-Profi bin) leider immer beim gleichen Resultat, nämlich dass das Script kaputt ist und nicht mehr funktioniert :P

Ich wäre Euch super dankbar wenn Ihr da irgendwelche Lösungsvorschläge hättet :)

PS: Falls Ihr noch mehr Infos braucht als angegeben liefere ich diese natürlich noch so gerne nach!

PS II: Bevor Ihr mich wegen der Nutzung von DIVs für eine Navigationsstruktur entgegen einer ul-li Struktur auslacht, keine Sorge, dies steht als nächstes an. Dazu muss ich aber erst am Script rumbasteln bis es wieder passt und dazu kam ich bis jetzt schlichtweg noch nicht ;)

Zitat:

Zitat von Kipperdesign (Beitrag 526056)

Meine Frage:
Wie könnte ich das Script so anpassen dass nur die Divs innerhalb eines mir definierten Divs angesteuert würden, also zB nur die Divs welche sich innerhalb des Divs "#navigation" befänden?

Code:

var divs = document.getElementsById('navigation').getElementsByTagName("div");

Hey super! Herzlichen Dank Protonenbeschleuniger!!

Werde ich gleich mal ausprobieren! :)

EDIT:
Ok habs ausprobiert, leider funktioniert das Script nachher nicht mehr :( Bzw. der Effekt funktioniert nicht mehr. Vielleicht eine Idee worans liegen könnte?

Zitat:

Zitat von Kipperdesign (Beitrag 526089)

Ok habs ausprobiert, leider funktioniert das Script nachher nicht mehr :( Bzw. der Effekt funktioniert nicht mehr. Vielleicht eine Idee worans liegen könnte?

Nein. Die Fehlerkonsole ist leer?

Hi Protonenbeschleuniger,

Also die Konsole spuckt bei mir folgendes aus:

http://img837.imageshack.us/img837/8...30211at103.png

Es muss „document.getElementById“ heißen, nicht „document.getElementsById“.

urgh, wie peinlich. Wo kam nur dieses 's' her?

Copy & Paste von getElementsByTagName?! ;)

Hehe immer diese kleinen Schreibfehler die sich einschleichen ;)

So hab ichs jetzt geschrieben

Code:

var divs = document.getElementById('navigation').getElementsByTagName("div");

Funktioniert jetzt perfekt!! Vielen lieben Dank für Eure Hilfe, Ihr seid spitze!!!