» »

Naključna Slika

Naključna Slika

NubCake ::

Zdravo!

Upam, da mi lahko kdo pomaga pri dokaj preprosi nalogi, ker jaz si že celi dan živce param kako narediti dokaj preprosto stvar (za nekoga, ki zna), mislim, da sem blizu rešitve, ampak nikakor nemorem najt prave sintakse za to kaj bi rad naredil.

Naredit hočem, da ko se stran naloži, da pokaže naključno sliko, to sem naredil in je dokaj enostavno, koda zgleda takole:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Untitled 1</title>
<script language="JavaScript"><!--
	slike = new Array(6);

	slike[0] = "<img src='Slike/1.jpg' alt='1'></a>";
	slike[1] = "<img src='Slike/2.jpg' alt='2'></a>";
	slike[2] = "<img src='Slike/3.jpg' alt='3'></a>";
	slike[3] = "<img src='Slike/4.jpg' alt='4'></a>";
	slike[4] = "<img src='Slike/5.jpg' alt='5'></a>";
	slike[5] = "<img src='Slike/6.jpg' alt='6'></a>";

	index = Math.floor(Math.random() * slike.length);

	document.write(slike[index]);
</script>

</head>

<body>

</body>
</html>


Problem pa nastane pri naslednjem koraku -> ko se z miško pomakneš na sliko (onmouseover/onmouseenter) pa bi se mogla naložit naslednja naključna slika.

To sem probaval in sem uspel narediti nekaj, da ko sem se zapeljal čez sliko, da mi je naložlo naslednjo naključno sliko, ampak po tem postopku, ki sem ga jaz napisal, mi naslednjo sliko naloži samo prvič, ko se zapeljem čez njo, naključne slike pa mi ne naloži na začetku (kar je logično, ker sem dal naj naloži prvo sliko vedno -> img src"Slike/1.jpg".

Tukaj je koda, ki naredi to:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Untitled 1</title>
<script language="JavaScript"><!--

	function nakljucnaSlika()
	{
		slike = new Array(6);

		slike[0] = "<img src='Slike/1.jpg' alt='1'></a>";
		slike[1] = "<img src='Slike/2.jpg' alt='2'></a>";
		slike[2] = "<img src='Slike/3.jpg' alt='3'></a>";
		slike[3] = "<img src='Slike/4.jpg' alt='4'></a>";
		slike[4] = "<img src='Slike/5.jpg' alt='5'></a>";
		slike[5] = "<img src='Slike/6.jpg' alt='6'></a>";

		index = Math.floor(Math.random() * slike.length);

		document.write(slike[index]);
	}

	function kolikoSlik()
	{
		var slika=document.getElementsByTagName("img");
		//alert("Tukaj so te slike: " + slike + " :)");
		alert("Tukaj je " + slika.length + " <img> elementov");
	}
</script>

</head>

<body>
	<img src="Slike/1.jpg" alt="slika" onclick="kolikoSlik()" onmouseover="nakljucnaSlika()" />
</body>
</html>


Mi lahko kdo pomaga kako bi se lotil tega na pravi način?

Hvala

HardFu ::

document.getElementsByTagName("body").item(0).innerHTML(slike[index]);


tole daj namesto vrstice 22 v drugem snippetu
http://codeable.io

NubCake ::

Tale vrstica ne naredi nič :/ Ali pa sem kaj narobe razumel, ampak, ko jo zamenjam, ne naredi ničesar :/

Anže Jarni ::

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Untitled 1</title>
<script language="JavaScript"><!--
 
    function nakljucnaSlika()
    {
        slike = new Array(6);
 
        slike[0] = "<img src='Slike/1.jpg' alt='1'></a>";
        slike[1] = "<img src='Slike/2.jpg' alt='2'></a>";
        slike[2] = "<img src='Slike/3.jpg' alt='3'></a>";
        slike[3] = "<img src='Slike/4.jpg' alt='4'></a>";
        slike[4] = "<img src='Slike/5.jpg' alt='5'></a>";
        slike[5] = "<img src='Slike/6.jpg' alt='6'></a>";
 
        index = Math.floor(Math.random() * slike.length);
 
        document.getElementById('slika').innerHTML = slike[index];
    }
 
    function kolikoSlik()
    {
        var slika=document.getElementsByTagName("img");
        //alert("Tukaj so te slike: " + slike + " :)");
        alert("Tukaj je " + slika.length + " <img> elementov");
    }
</script>
 
</head>
 
<body>
    <div id="slika">
        <img src="Slike/1.jpg" alt="slika" onclick="kolikoSlik()" onmouseover="nakljucnaSlika()" />
    </div>
</body>
</html>


Vendar ta tvoja rešitev ni najboljša. Bolje je da imaš array src-jev in alt-ov in potem samo ti dve lastnosti spreminjaš, kot pa da zmeraj pišeš cel novi img tag v kontejner.


Vredno ogleda ...

TemaSporočilaOglediZadnje sporočilo
TemaSporočilaOglediZadnje sporočilo
»

Android programiranje

Oddelek: Programiranje
405264 (1514) acookook
»

Spletna stran z login

Oddelek: Izdelava spletišč
201907 (1354) krikoman
»

HTML povecava slike na hover over

Oddelek: Izdelava spletišč
6805 (706) para!
»

excell razvrščanje

Oddelek: Programska oprema
214119 (3763) rferrari
»

Kdaj uporabiti izjeme?

Oddelek: Programiranje
241695 (1576) Gundolf

Več podobnih tem