Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [HTML][JavaScript]funkcja nie dziala, wyswietlanie zdjec
Mastersieciweb
post
Post #1





Grupa: Zarejestrowani
Postów: 84
Pomógł: 0
Dołączył: 14.10.2013

Ostrzeżenie: (0%)
-----


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>

Ten post edytował Mastersieciweb 5.11.2013, 17:50:33
Go to the top of the page
+Quote Post
 
Start new topic
Odpowiedzi (1 - 3)
b4rt3kk
post
Post #2





Grupa: Zarejestrowani
Postów: 1 933
Pomógł: 460
Dołączył: 2.04.2010
Skąd: Lublin

Ostrzeżenie: (0%)
-----


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:

  1. <img src="1.jpg" id="img1" />
  2. img = document.getElementById("img1");
  3. img.onmouseover = function() {
  4. this.src = '2.jpg';
  5. }


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:

  1. <img src="1.jpg" id="img1" />
  2. img = document.getElementById("img1");
  3. img.onmouseover = function() {
  4. this.src = '2.jpg';
  5. }
  6. <img src="2.jpg" id="img2" />


Rozwiązaniem jest zastosowanie (przynajmniej w jQuery, z JS już sporo zapomniałem) np. "on".
Go to the top of the page
+Quote Post
Mastersieciweb
post
Post #3





Grupa: Zarejestrowani
Postów: 84
Pomógł: 0
Dołączył: 14.10.2013

Ostrzeżenie: (0%)
-----


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>
Go to the top of the page
+Quote Post
Qss
post
Post #4





Grupa: Zarejestrowani
Postów: 141
Pomógł: 7
Dołączył: 22.02.2009

Ostrzeżenie: (0%)
-----


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ć
  1. getElementsByClassName


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

  1. <img src="15.jpg" onmouseover="funkcja('obrazek.jpg')" onmouseout="funkcja('obrazek.jpg')" />


najlepiej jakbyś zainteresował się jquery (IMG:style_emoticons/default/wink.gif)

Ten post edytował Qss 6.11.2013, 12:38:33
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Aktualny czas: 23.08.2025 - 18:58