Forum PHP.pl > [HTML][JavaScript]funkcja nie dziala

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: [HTML][JavaScript]funkcja nie dziala

Mastersieciweb

5.11.2013, 17:47:36

witam mam problem bo wyswietla mi podana ilosc obrazkow ale nie zmieniaja sie po najechaniu na nich myszka czyli onmouseover i onmouseout.. gdzie tu jest blad.. dodam ze osobno te funkcje dzialaja ale razem nie..
nie wiem jaką zmienną dać jako moje 'gh'..

<html>
<head>
</head>
<body>
<a id="cc"><img src="15.jpg" width="100" height="100" id="obrazekk" /> </a>
<a id="dd"><img src="15.jpg" width="100" height="100" id="obrazekk" /> </a>

<script>

var x=1;
while (x<13) {

var itmc=document.getElementById("dd");
var clns=itmc.cloneNode(true);
document.getElementById("cc").appendChild(clns);

x++;
var gh = document.getElementById("cc").appendChild(clns);
gh.onmouseover = function() {
this.src = 't.jpg';
}
gh.onmouseout = function() {
this.src = 'y.jpg';
}}

</script>

</body>
</html>

b4rt3kk

5.11.2013, 18:20:13

Po co w pętli JS tworzysz ileś tam obrazków po załadowaniu strony? Do tego celu nie ma najmniejszego sensu używać JS. To po pierwsze. A po drugie, nie działa, bo elementy dodawane w "locie" przez JS nie są później przez tenże widziane jako tako. Przykład:

[HTML] pobierz, plaintext 
<img src="1.jpg" id="img1" />
<script>
img = document.getElementById("img1");
img.onmouseover = function() {
  this.src = '2.jpg'; 
}
</script>
[HTML] pobierz, plaintext

Teraz załóżmy, że masz też funkcję, która doda obrazek, co prawda nie będzie on za kodem skryptu, ale nie będzie dla niego działać, bo nie będzie w jego zasięgu. Wyobraź sobie coś takiego:

[HTML] pobierz, plaintext 
<img src="1.jpg" id="img1" />
<script>
img = document.getElementById("img1");
img.onmouseover = function() {
  this.src = '2.jpg'; 
}
</script>
<img src="2.jpg" id="img2" />
[HTML] pobierz, plaintext

Rozwiązaniem jest zastosowanie (przynajmniej w jQuery, z JS już sporo zapomniałem) np. "on".

Mastersieciweb

6.11.2013, 09:44:10

to w jaki sposób mam wyświetlić np 10 obrazów i na każdym zastosować tą funkcję?:

<img src="1.jpg" id="img1" />

<script>

img = document.getElementById("img1");

img.onmouseover = function() {

this.src = '2.jpg';

}

</script>

Qss

6.11.2013, 12:37:53

jeśli chcesz zastosować efekt zmiana obrazu po najechaniu myszką i odwrotnie to może nie wstawiać obrazków tylko np. diva i zastosować metodę css sliding doors

Jeśli wszystkie obrazki są takie same to zastosować

[PHP] pobierz, plaintext 
getElementsByClassName
[PHP] pobierz, plaintext

jeszcze inaczej możesz napisać funkcję i dodać w każdym obrazu zdarzenie

[PHP] pobierz, plaintext 
<img src="15.jpg" onmouseover="funkcja('obrazek.jpg')"  onmouseout="funkcja('obrazek.jpg')" />
[PHP] pobierz, plaintext

najlepiej jakbyś zainteresował się jquery

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.