• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

[ERLEDIGT] JS auf Ordner zugreifen

rofl1234567

Mitglied
Hey Leute ich hab ein Problem und zwar überlege ich wie ich in Javascript auf Ordner zugreifen kann:
Javascript:
window.onload = function() {
    var images = document.getElementsByTagName("img");
    for (var i = 0; i < images.length; i++) {
        images.onmouseover = showAnswer;
        images.onmouseout = e;
    }
};
function showAnswer(eventObj) {
    var image = eventObj.target;
    var name = image.id;
    name = name + ".jpg";
    image.src = name;
}

function e(eventObj) {
    var image = eventObj.target;
    var name = image.id;
    name = name + "e.jpg";
    image.src = name;
}
Meine Bilder sind 10 Unterordnern gespeichert.
Die Seite lädt wie gewollt, doch wenn ich auf eines der Bilder klicke, sucht er wie man in der Console sehen kann in meinem INDEX ordner nach :
.jpg:1 GET http://localhost/INDEX/.jpg 404 (Not Found)
e.jpg:1 GET http://localhost/INDEX/e.jpg 404 (Not Found)
da er ja nicht weiß, dass ich meine Bilder in Unterordnern gespeichert habe.
Meine Frage wie schaffe ich es dass in Javascript anzugeben

Falls euch dass nicht klar ist: Dass Bild dass zuerst angezeigt wird hat ein *e* hintenan stehen und die Bilder die beim Eventhandler angezeigt werden sollen besitzen dieses e nicht. :)

Ein weiteres Problem ist, dass der Event Handler alle meine Bilder nach diesem Script abspielt, aber ich will nur Bestimmte Bilder dafür benutzen...
Vielen Dank für eure Hilfe :)
 
Zuletzt bearbeitet von einem Moderator:
Hey Leute ich hab ein Problem und zwar überlege ich wie ich in Javascript auf Ordner zugreifen kann:
Javascript:
window.onload = function() {
    var images = document.getElementsByTagName("img");
    for (var i = 0; i < images.length; i++) {
        images.onmouseover = showAnswer;
        images.onmouseout = e;
    }
};
function showAnswer(eventObj) {
    var image = eventObj.target;
    var name = image.id;
    name = name + ".jpg";
    image.src = name;
}

function e(eventObj) {
    var image = eventObj.target;
    var name = image.id;
    name = name + "e.jpg";
    image.src = name;
}
Meine Bilder sind 10 Unterordnern gespeichert.
Die Seite lädt wie gewollt, doch wenn ich auf eines der Bilder klicke, sucht er wie man in der Console sehen kann in meinem INDEX ordner nach :
.jpg:1 GET http://localhost/INDEX/.jpg 404 (Not Found)
e.jpg:1 GET http://localhost/INDEX/e.jpg 404 (Not Found)
da er ja nicht weiß, dass ich meine Bilder in Unterordnern gespeichert habe.
Meine Frage wie schaffe ich es dass in Javascript anzugeben

Falls euch dass nicht klar ist: Dass Bild dass zuerst angezeigt wird hat ein *e* hintenan stehen und die Bilder die beim Eventhandler angezeigt werden sollen besitzen dieses e nicht. :)

Ein weiteres Problem ist, dass der Event Handler alle meine Bilder nach diesem Script abspielt, aber ich will nur Bestimmte Bilder dafür benutzen...
Vielen Dank für eure Hilfe :)

Sieht so aus als hätten die images keine ID?
Zum zweiten Problem, verwende querySelectorAll (https://developer.mozilla.org/de/docs/Web/API/Document/querySelectorAll) statt getElementsByTagName um dein Suchkriterium per CSS Selektoren einzugrenzen.
 
HTML:

<li>
<div class="TC_HOME">
<a href="#"><img src="images/TC/TCx890x501e.jpg" width="890" height="501" alt="TC"></a>
<span>TC</span>
</div>
</li>

CSS:

.TC_HOME {
width: 890px;
position: relative;
}

.TC_HOME span {
background-color: silver;
background-color: hsla(0, 0%, 100%, 0.5);
position: absolute;
bottom: 0;
width: 100%;
line-height: 2em;
text-align: center;
margin-left: auto;
font-size: x-large;
font-weight:bold;
}

.TC_HOME img {
display: block;
position: auto;
}
 
HTML:

<li>
<div class="TC_HOME">
<a href="#"><img src="images/TC/TCx890x501e.jpg" width="890" height="501" alt="TC"></a>
<span>TC</span>
</div>
</li>

CSS:

.TC_HOME {
width: 890px;
position: relative;
}

.TC_HOME span {
background-color: silver;
background-color: hsla(0, 0%, 100%, 0.5);
position: absolute;
bottom: 0;
width: 100%;
line-height: 2em;
text-align: center;
margin-left: auto;
font-size: x-large;
font-weight:bold;
}

.TC_HOME img {
display: block;
position: auto;
}

Tja, wie ich gesagt habe.
Aber wenn du meinst ich bessere dir jetzt deinen unformatierten Code aus, den du hier ohne Kommentar hinklatscht, dann irrst du dich leider ;)
 
Okay ja tut mir leid ich konnte leider nichts mit dem anfangen was du mir da oben geschickt hast ich lese mir dass gleich mal durch danke schonmal ;)
 
Ja gut also meine eigentliche Frage wurde zwar nicht beantwortet aber danke trotzdem für die restlichen Informationen die werden mir sicher noch helfen :)

Ihr könnt die Frage als erledigt markieren
 
Zurück
Oben