Forum Sveta kompjutera

Nazad   Forum Sveta kompjutera > Internet > Web razvoj

Web razvoj Sve u vezi sa razvojem Internet sajtova: programi, dizajn, usluge hostinga, administracija...

Odgovor
 
Alatke vezane za temu Vrste prikaza
Stara 24.6.2012, 14:57   #1
Teva
Starosedelac
 
Član od: 23.2.2006.
Lokacija: Tamo gde su kuće od čokolade i prozori od marmelade....
Poruke: 1.579
Zahvalnice: 195
Zahvaljeno 301 puta na 171 poruka
Određen forumom Galerija JavaScript

Radim seminarski za fax i sad to treba da bude sajt sa nekim silnim čudima, doduše to je nebitno.

I sad hoću da napravim galeriju od 5,6 slika i da ubacim.
Pisao sam skriptu koja radi "slajd" levo desno tako što povećava ili smanjuje širinu elementa (u ovom slučaju diva)

Pa sam kasnije to preradio i ubacio u moju galeriju.
Iz nekog razloga meni te funkcije neće da rade na divovima u toj galeriji.

Kod skripte "levo/desno"

Kod:
<html xmlns='http://www.w3.org/1999/xhtml'>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=utf-8' />
<title>Untitled Document</title>

<style type='text/css' >

#kontejner{
	width: 50%;
	margin: auto;
	}
#plavi{
	width: 200px;
	height: 200px;
	background-color: blue;
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 1;
	}

#crveni{
	width: 200px;
	height: 200px;
	background-color: red;
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 2;
	
	}

</style>

<script type='text/javascript'>

	var i;
	function zatvori_int(){
		i = clearInterval(i);
		}

	function pomeri_levo(){
			var sirina =parseInt(document.getElementById('crveni').style.width);	
			sirina = sirina - 2;
			document.getElementById('crveni').style.width = sirina;
			if(sirina == 0)
				zatvori_int();
		}
	function pomeri_desno(){
			var sirina = parseInt(document.getElementById('crveni').style.width);
			sirina = sirina + 2;
			document.getElementById('crveni').style.width = sirina;
			if(sirina == 200)
				zatvori_int();
	}
	
	function dugme_levo(){
			if(parseInt( document.getElementById('crveni').style.width) == 0)
				return;
			else
					i = setInterval('pomeri_levo()',10);
		}
	function dugme_desno(){
			if(parseInt(document.getElementById('crveni').style.width) == 200)
				return;
			else
					i = setInterval('pomeri_desno()',10);
		}
</script>

</head>

<body>

<div id='kontejner' >
	
    <input type='button' id='levo' value='Levo'  onclick='dugme_levo()'/>
    <input type='button' id='desno' value='Desno' onclick='dugme_desno()' />
    <br />
    <br />
    
  <div id='crveni' style="width: 200px;">
    </div>
    <div id='plavi' style="width: 200px;">
    </div>

</div>

</body>
</html>
KOd galerije

Kod:
<!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 http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link rel="stylesheet" type="text/css" href="style_slide.css"/>

<script type='text/javascript'>

	var i;
	function zatvori_int(){ //Funkcija za zaustavljanje intervala
		i = clearInterval(i);
		}

	function pomeri_levo(elem){ // funkcija koja smanjuje sirinu diva do 0 (stvara privid kao da se "pomera" ulevo)
	//argument je string koji reprezentuje ime elementa sa kojim treba da radi.
			
			var temp = String(elem);
			//window.alert(temp);
			var sirina = parseInt(document.getElementById(temp).style.width);	
			sirina = sirina - 2;
			//window.alert("entry level");
			
			document.getElementById(temp).style.width = sirina;
			if(sirina == 0)
				zatvori_int();
		}
		
	function pomeri_desno(elem){ // funkcija koja povecava sirinu diva do 440 (stvara privid kao da se "pomera" udesno)
	//argument je string koji reprezentuje ime elementa sa kojim treba da radi.
		
			var sirina = parseInt(document.getElementById(elem).style.width);
			sirina = sirina + 2;
			document.getElementById(elem).style.width = sirina;
			if(sirina == 440)
				zatvori_int();
	}
	
	function sledeci(elem){ // funkcija koja poziva setInterval sa gore pomenutim funkcijama 
	//takodje sadrzi string argument sa imenom elementa
			if(parseInt( document.getElementById(elem).style.width) == 0)
				return;
			else
					i = setInterval('pomeri_levo(elem)',10);
		}
	function prethodni(elem){ // funkcija koja poziva setInterval sa gore pomenutim funkcijama 
		// takodje sadrzi string argument sa imenom elementa
			if(parseInt(document.getElementById(elem).style.width) == 440)
				return;
			else
					i = setInterval('pomeri_desno(elem)',10);
		}
	var tek_el = 1;
	
	function div_sl(){ //funkcija koja predstavlja kontrolu sledeci, poziva gornje funkcije i generise elem koji predstavlja element sa kojim se radi
		if( tek_el < 6 ){
			var elem = "slika"+tek_el;
			//window.alert(elem);
			sledeci(elem);
			tek_el = tek_el + 1;
		}
		else
			window.alert(" NEMA! ");
		}
		
	function div_pr(){ //funkcija koja predstavlja kontrolu prethodni, poziva gornje funkcije i generise elem koji predstavlja element sa kojim se radi
		if(tek_el > 1){
			var elem = "slika"+tek_el;
			prethodni(elem);
			tek_el = tek_el - 1;
			}
		else 
			window.alert("nema");
		}
</script>


</head>

<body>

<div id="kontejner">

	<div id="sl_div" class="kontrole" onclick="div_sl()">
    	<img src="ss_sl.png" alt="nesto" />
    </div>
    
    <div id="slika1" style="width: 440px;"  > <img src="slika1.jpg" alt="s1" /> </div>
    <div id="slika2" style="width: 440px;"  > <img src="slika2.jpg" alt="s2" /> </div>
    <div id="slika3" style="width: 440px;"  > <img src="slika3.jpg" alt="s3" /> </div>
    <div id="slika4" style="width: 440px;"  > <img src="slika4.jpg" alt="s4" /> </div>
    <div id="slika5" style="width: 440px;"  > <img src="slika5.jpg" alt="s5" /> </div>
    <div id="slika6" style="width: 440px;"  > <img src="slika6.jpg" alt="s6" /> </div>
    
    
    <div id="pr_div" class="kontrole" spry:hover="preko" onclick="div_pr()">
    	<img src="ss_pr.png" alt="nesto2"  />
    </div>

</div>
</body>
</html>
Galerija: http://min.us/mrNHqg7C7
Skripta: http://min.us/mQjolJJwA

Hvala unapred
Teva je offline   Odgovor sa citatom ove poruke
Odgovor

Bookmarks sajtovi

Alatke vezane za temu
Vrste prikaza

Vaš status
Ne možete postavljati teme
Ne možete odgovarati na poruke
Ne možete slati priloge uz poruke
Ne možete prepravljati svoje poruke

BB kod: uključeno
Smajliji: uključeno
[IMG] kod: uključeno
HTML kod: isključeno


Slične teme
tema temu započeo forum Odgovora Poslednja poruka
Početnički 3D radovi - galerija (WIP, tutorijali) kinteC 3D radovi 2053 23.5.2019 17:24
JavaScript. da/ne Game fever Klijentske aplikacije 1 10.10.2011 0:06
Flashplayer i Javascript, pomoć! Lazar95 Aplikativni softver 5 13.1.2009 1:19
JavaScript: Kako uzeti sadržaj nekog taga? urke Klijentske aplikacije 8 19.8.2008 13:33
javascript - pomoc nika100 Programiranje 2 17.2.2007 16:25


Sva vremena su po Griniču +2 h. Sada je 23:27.


Powered by vBulletin® verzija 3.8.7
Copyright ©2000–2020, vBulletin Solutions, Inc.
Hosted by Beograd.com