mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Di 19.03.2024 05:38 Benutzername: Passwort: Auto-Login

Thema: Mehrere IDs in getElementbyID vom 21.11.2010


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Programmierung -> Mehrere IDs in getElementbyID
Autor Nachricht
suzansuzi
Threadersteller

Dabei seit: 21.11.2010
Ort: -
Alter: 39
Geschlecht: Weiblich
Verfasst So 21.11.2010 00:05
Titel

Mehrere IDs in getElementbyID

Antworten mit Zitat Zum Seitenanfang

Hi leute Grins

kann mir jemadn bitte helfen? Ich hab alles mögliche probiert, aber ich weis nicht wie ich mehrere divs bzw deren ids über javascripts getElementbyId anspreche *Schnief*((


Bitte bitte bitte helft mir
  View user's profile Private Nachricht senden
Ivan

Dabei seit: 17.04.2006
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst So 21.11.2010 12:09
Titel

Antworten mit Zitat Zum Seitenanfang

Identische IDs innerhalb eines Dokuments sind sowieso nicht erlaubt.
Glaube, was du suchst ist das Attribut "name".

-> getElementsByName()

Zurück kriegste ein Array.
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Anzeige
Anzeige
suzansuzi
Threadersteller

Dabei seit: 21.11.2010
Ort: -
Alter: 39
Geschlecht: Weiblich
Verfasst So 21.11.2010 12:22
Titel

Antworten mit Zitat Zum Seitenanfang

Ich glaub, ich sollte es genauer beschreiben:

Code:

window.onload = function (){ 
  //  collect menu items and attach onMouseOver and onMouseOut events 
  var mi = document.getElementById('menu').getElementsByTagName('a'); 
  for (var i=0; i<mi.length; i++){ 
    mi[i].onmouseover = function(e) {fade(this, opLow,  2)} // fade in  - positive step 
    mi[i].onmouseout  = function(e) {fade(this, opHigh, 10)} // fade out - negative step 
  } 
}


an der stelle wo eben bei "... getElementbyId('menu')..." steht, dass ich da mehrere ids reintue - und ich habs schon mit ('menu1,menu2') oder ('menu1','menu2') oder ('menu1+menu2') oder ('menu1'+'menu2') probiert, aber keine chance - es wird immer nur eins gefadet.

Und gibt es eine möglichkeit bei: ...getElementsbyTagName('a')... stattdessen "a:hover" einzugeben?
  View user's profile Private Nachricht senden
fyll

Dabei seit: 20.09.2003
Ort: Augsburg
Alter: 39
Geschlecht: Männlich
Verfasst So 21.11.2010 12:33
Titel

Antworten mit Zitat Zum Seitenanfang

suzansuzi hat geschrieben:
an der stelle wo eben bei "... getElementbyId('menu')..." steht, dass ich da mehrere ids reintue - und ich habs schon mit ('menu1,menu2') oder ('menu1','menu2') oder ('menu1+menu2') oder ('menu1'+'menu2') probiert, aber keine chance - es wird immer nur eins gefadet.

Code:

window.onload = function (){
  var mi = document.getElementById('menu').getElementsByTagName('a'); 
  var mu = document.getElementById('menu2').getElementsByTagName('a'); 
  for (var i=0; i<mi.length; i++){ 
    mi[i].onmouseover = function(e) {fade(this, opLow,  2)}
    mi[i].onmouseout  = function(e) {fade(this, opHigh, 10)}
  } 
  for (var i=0; i<mu.length; i++){ 
    mu[i].onmouseover = function(e) {fade(this, opLow,  2)}
    mu[i].onmouseout  = function(e) {fade(this, opHigh, 10)}
  } 
}
* Keine Ahnung... *
getElementById => singular ... lesen

Zitat:
Und gibt es eine möglichkeit bei: ...getElementsbyTagName('a')... stattdessen "a:hover" einzugeben?

wtf? Au weia!
  View user's profile Private Nachricht senden
suzansuzi
Threadersteller

Dabei seit: 21.11.2010
Ort: -
Alter: 39
Geschlecht: Weiblich
Verfasst So 21.11.2010 13:01
Titel

Antworten mit Zitat Zum Seitenanfang

Danke, das mit den unterschiedlichen Variablennamen ist sehr logisch, aber da muss man erst mal drauf kommen - hatte den falschen ansatz. Das funktioniert!

Das mit "...getElementbyTagName('a')..." steht ja auch im Code und ich nehme an, dass sich das auf das Link das mit a versehen ist sich bezieht und meine Frage ist, weil ich nur die hover Effekte faden will und nicht das normale Bild, kann ich im Code nicht angeben das nur eben das hoverchen gefadet wird?

Und (gleich nach der Frage der ganze HTML-Code auch als beispiel) irgendwo hab ich anscheinend noch ein fehler gemacht, denn wenn ich mit der mouse drauf gehe wird das Hover-Bild gefadet und auch wenn ich wieder runter gehe wird es ausgefadet und auch das normale Bild ist voll (also zu 100%) da, aber und das ist mein problem, wenn die Seite neu geladen wird bzw. zum ersten mal aufgerufen wird, ist das original Bild nur Transparent zu sehen - warum? Mädchen!

Code:

<html>
<head>

<style type="text/css">
#menu td{
     width: 210px; 
     height: 43px; 
     opacity: 0.3;              
     filter: alpha(opacity=20); 

#menu td a{
   background-image:url(angebote.jpg);
     display: block; 
     width: 210px; 
     height: 43px; 

#menu td a:hover{
   background-image:url(angebote.png);
}
</style>

<script language="javascript" type="text/javascript">
var opHigh = 100;
var opLow  = 20;
 
window.onload = function (){ 
  var mi = document.getElementById('menu').getElementsByTagName('a'); 
  for (var i=0; i<mi.length; i++){ 
    mi[i].onmouseover = function(e) {fade(this, opLow,  2)}
    mi[i].onmouseout  = function(e) {fade(this, opHigh, 10)}
  } 

 
function fade(mi, opacity, step){ 
  mi.parentNode.style.opacity = opacity / 100;
  mi.parentNode.style.filter  = "alpha(opacity="+opacity+")";
  opacity += step;
  if (opLow <= opacity && opacity <= opHigh) setTimeout(function(){fade(mi,opacity,step)}, 20); 
}
</script>

</head>

<body>
<table id="menu" border="0">
   <tr height="43">
      <td width="210"><a href="#"></a></td>
    </tr>
    <tr height="43">
      <td width="210"><a href="#"></a></td>
   </tr>
</table>
</body>
</html>


Bitte bitte bitte helft mir - ich krieg ne krise wenn ich weitere Tage damit verbringe
  View user's profile Private Nachricht senden
fyll

Dabei seit: 20.09.2003
Ort: Augsburg
Alter: 39
Geschlecht: Männlich
Verfasst So 21.11.2010 17:54
Titel

Antworten mit Zitat Zum Seitenanfang

suzansuzi hat geschrieben:
... Das mit "...getElementbyTagName('a')..." steht ja auch im Code und ich nehme an, dass sich das auf das Link das mit a versehen ist sich bezieht und meine Frage ist, weil ich nur die hover Effekte faden will und nicht das normale Bild, kann ich im Code nicht angeben das nur eben das hoverchen gefadet wird?

Das bezieht sich auf alle <a...>, die innerhalb von <... id=menu ...> liegen.
Die Funktion wird ausgeführt, wenn du mit der Maus drüber gehst... das ist im JS das "onMouseOver".
Gleichzeitig sagst du durch a:hover im CSS: wechsel die Hintergrundgrafik.
Ich versteh zwar nicht, was dein Problem ist, aber tausche doch mal im CSS das .jpg durch .png ^^

suzansuzi hat geschrieben:
Und (gleich nach der Frage der ganze HTML-Code auch als beispiel) irgendwo hab ich anscheinend noch ein fehler gemacht, denn wenn ich mit der mouse drauf gehe wird das Hover-Bild gefadet und auch wenn ich wieder runter gehe wird es ausgefadet und auch das normale Bild ist voll (also zu 100%) da, aber und das ist mein problem, wenn die Seite neu geladen wird bzw. zum ersten mal aufgerufen wird, ist das original Bild nur Transparent zu sehen - warum? Mädchen!
Weil dasso im CSS steht:
Code:

     opacity: 0.3;              
     filter: alpha(opacity=20); 

tausch das mal durch 1.0 und 100

Zitat:
Bitte bitte bitte helft mir - ich krieg ne krise wenn ich weitere Tage damit verbringe
Vorhin wurde schon selfHTML verlinkt. Schnappe dir die Begriffe aus deinem Code und suche danach... und verstehe, was was bedeutet.
Das ist in kürzester Zeit erledigt und du hast auch was davon... wnen wir hier einen auf Erklärbär machen und dir alles vorkauen nicht.. gar nicht.
  View user's profile Private Nachricht senden
suzansuzi
Threadersteller

Dabei seit: 21.11.2010
Ort: -
Alter: 39
Geschlecht: Weiblich
Verfasst So 21.11.2010 19:37
Titel

Antworten mit Zitat Zum Seitenanfang

Hahaha Grins endlich - es hat sich alles geklärt!

Ich musste nur im CSS-Teil das ganze opacity und filter weglassen usw. und es funtioniert Lächel

Dadrauf muss man erst mal kommen, dass das nicht für die Fade-Funtion zwingend notwendig ist.


Zitat: "Das bezieht sich auf alle <a...>, die innerhalb von <... id=menu ...> liegen.
Die Funktion wird ausgeführt, wenn du mit der Maus drüber gehst... das ist im JS das "onMouseOver".
Gleichzeitig sagst du durch a:hover im CSS: wechsel die Hintergrundgrafik.
Ich versteh zwar nicht, was dein Problem ist, aber tausche doch mal im CSS das .jpg durch .png ^^" zitat-ende

Das hab ich ja gewusst, nur wie ich oben schon erwähne, opacity und filter.. im css-teil haben alles faden lassen und darum dachte ich, dass ich wenn ich nur den hover faden lassen will bei getelementbytagname('a') statt a a:hover oder so eintragen muss.

Was SelfHTML betrifft, ich habe schon zwei Tage versucht alles dort und auch auf zick anderen seiten mir angeguckt, aber nicht schlau draus geworden - Das Problem ist, wenn man etwas machen will und sich das nur vorstellen kann aber nicht die richtigen Ausdrücke kennt, kann man lange suchen.


Aber dennoch danke an alle - ich habs zum Teil geschafft und der Rest ist anscheinend nicht ohne weiteres Möglich, also lasse ich es (kostenuneffizient).



Viel Spass noch

bye
  View user's profile Private Nachricht senden
 
Ähnliche Themen CSS mit JS auslesen: getElementById
Javascript: Problem mit getElementById
Noob frage :-( document.getElementById(' ').style.height
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Programmierung


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.