wilqazz

Reikia paaiškinimo [Skubu]

Recommended Posts

┬áTaigi taip atsitiko, kad kuriant mokyklai tinklap─» i┼íkilo neai┼íkumu. Darau galerija, j─ů paimiau i┼í ka┼żkokio puslapio ir yra kelios komandos kuri┼│ nesuprantu. Ko nesuprantu nuotraukoje pabraukta juodai. Java script n─Śra tik html ir css.

6e37022144d3c182e98dde4325380384539.png

 

Dalintis ┼í─» prane┼íim─ů


Nuoroda iki šio pranešimo
Dalintis per kit─ů puslap─»

Tipo kai u┼żvesi pele padidins ar pary┼íkins, o gla net parodys, ne┼żinau funkcijos, bet turi u┼żvesti pele.

Dalintis ┼í─» prane┼íim─ů


Nuoroda iki šio pranešimo
Dalintis per kit─ů puslap─»

O kaip ─»vyksta tas procesas? D─Śl ko veikia. Ten yra kaip ─Źia pavadint ekrane tie du ekranai (div) Vienas nuotraukos o kitas langas kur u┼żvedus pele ant nuotraukos per visa langa atsidaro nuotrauka. Kod─Śl visa tai vyksta?

Pas mane šita http://html-tuts.com/demo/photo_gallery/

Dalintis ┼í─» prane┼íim─ů


Nuoroda iki šio pranešimo
Dalintis per kit─ů puslap─»

Nueik ─» CSS fail─ů ir ten susirask "onmouseover", visa tai daro CSS'as, ten ir koreguotis visk─ů gal─Śsi.

Dalintis ┼í─» prane┼íim─ů


Nuoroda iki šio pranešimo
Dalintis per kit─ů puslap─»

Va ta tame ir esme jei b┼źtu tai css faile supras─Źiau, o dbr nesuprantu.

}
				.thumbnails img {
				height: 80px;
				width: 80px
				border: 4px solid #555;
				padding: 1px;
				margin: 0 10px 10px 0;
			}

				.thumbnails img:hover {
				border: 4px solid #00ccff;
				cursor:pointer;
			}

				.preview img {
				border: 4px solid #444;
				padding: 1px;
				width: 800px;
				height: 400px;

Dalintis ┼í─» prane┼íim─ů


Nuoroda iki šio pranešimo
Dalintis per kit─ů puslap─»

Nueik ─» CSS fail─ů ir ten susirask "onmouseover", visa tai daro CSS'as, ten ir koreguotis visk─ů gal─Śsi.

CSS has nothing to do with HTML events...

 

 

 

onmouseover="" ─»vykis vykdo skript─ů, kai pel─Śs ┼żymeklis u┼żeina ant elemento.

Tau reikia skripto, kuris pakeist┼│ div tag'o su klase "preview" nuotrauk─ů ─» pel─Śs ┼żymeklio u┼żvesto img elemento nuotrauk─ů.

 

┼áis JavaScript (labiau jQuery, bet vadink kaip nori) kodas tur─Śt┼│ suveikti:

 

<script type="text/javascript">
    $(function(){
        $('.thumbnails img').hover(function(){
            $('#preview').attr('src',$(this).attr('src'));
        }, null);
    });
</script>

─«d─Śk ┼íias kodo eilutes prie┼í </body> tag'─ů.

 

Taip pat tau reikia jQuery bibliotekos savo svetain─Śje. ─«d─Śk ┼íi─ů kodo eilut─Ö prie┼í jQuery skript─ů:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

Ir pakeisk vis┼│ element┼│ name atributus ─» id atribut─ů. "name" atributas naudojamas formose, kad su PHP kalba gal─Śtum i┼ígauti laukeli┼│ reik┼ímes ir t.t.. Tai pavyzd┼żiui, jeigu img elementas buvo toks...

<img onmouseover="preview.src=img1.src" name="img1" src="img/img1.jpg" alt="">

...tai pakeistas tur─Śt┼│ atrodyti taip...

<img onmouseover="preview.src=img1.src" id="img1" src="img/img1.jpg" alt="">

Na ir dar ┼íis tas.┬á Pana┼íu, kad pas tave div tag'as su klase "thumbnails" n─Śra u┼żdarytas.

 

Jeigu vistiek problema nei┼ísisprend─Ś, mestelk savo skype ir sutvarkysim.

Redaguota , nario DamnedWolf

Dalintis ┼í─» prane┼íim─ů


Nuoroda iki šio pranešimo
Dalintis per kit─ů puslap─»

Prisijungti prie diskusijos

Palikti atsakym─ů galite i┼í karto, o u┼żsiregistruoti v─Śliau. Jeigu jau turite paskyr─ů m┼źs┼│ forume, Prisijunkite.

Sve─Źias
Atsakyti šioje temoje...

×   ─«klijuotas tekstas turi teksto formatavim─ů.   Pa┼íalinti teksto formatavim─ů

  Galimi tik 75 veidukai.

×   Nuoroda buvo automati┼íkai ─»terpta.   ─«terpti nuorod─ů paprastai

×   J┼źs┼│ ankstesnis prane┼íimas buvo atkurtas.   I┼ívalyti redaktori┼│

×   J┼źs negalite ─»kelti nuotraukas tiesiogiai.─«kelkite arba ─»d─Śkite nuotraukas i┼í URL.


  • ┼áiame puslapyje nar┼ío:   0 nariai

    N─Śra registruot┼│ nari┼│ per┼żi┼źrin─Źi┼│ ┼í─» forum─ů.