Page 1 of 1

#1 javascript stručnjaci

Posted: 26/05/2006 16:51
by Sensei
Treba mi ovaj stil menija, međutim ne mogu nabaciti više od jednog podlinka .

Primjer

Code: Select all

<html>

<head>
<script type="text/javascript">
function change(id){ 
     ID = document.getElementById(id); 
     
     if(ID.style.display == "") 
          ID.style.display = "none"; 
     else 
          ID.style.display = ""; 
      }
</script>
</head>

<body>

<table width="170">
 <!-- osnovni link -->
  <tr>
  <td>
  <a onclick="change(1)" href="#">Meni link1</a></td>
  </tr>
  <!-- podlink 1 -->
  <tr style="display: none" id="1">
  <td>Podlink 1</td>
  </tr>
  </table>
  
</body>

</html>

#2

Posted: 26/05/2006 21:43
by forUMASH
....nije mi bas najjasnije sta tacno hoces....jel' ovako nesto???
<html>

<head>
<script type="text/javascript">
function change(id){
ID = document.getElementById(id);

if(ID.style.display == "")
ID.style.display = "none";
else
ID.style.display = "";
}
</script>
</head>

<body>

<table width="170">
<!-- osnovni link -->
<tr>
<td>
<a onclick="change(1)" href="#">Meni link1</a></td>
</tr>
<!-- podlink 1 -->
<tr style="display: none" id="1">
<td>
<a href="1#">Podlink 1</a>
<br><a href="2#">Podlink 2</a>

<br><a href="3#">Podlink 3</a>
</td>
</tr>


<tr>
<td>
<a onclick="change(2)" href="#">Meni link2</a></td>
</tr>
<!-- podlink 2 -->
<tr style="display: none" id="2">
<td>
<a href="1#">Podlink 4</a>
<br><a href="2#">Podlink 5</a>

<br><a href="3#">Podlink 6</a>
</td>
</tr>
</table>

</body>

</html>

#3

Posted: 27/05/2006 04:33
by Sensei
U osnovi to je to i switch radi, ali mi je potrebno da se svaki od podlinkova nalazi i svojoj ćeliji u sklopu tabele.

#4

Posted: 27/05/2006 15:56
by neko iz mase
Imas dvije mogucnosti, jedna da redove pravis preko dhtml-a, gdje bi svaki podlink mogao imati svoj id (znaci referencu). Drugi pristup je da ispod glavnog linka imas prazan cell sa display:block. U njemu imas novi table sa svakim podlinkom. To bi bilo malo jednostavnije. Pokusacu se danas pozabaviti sa ovim prvim pa ti izbaciti dio koda

#5

Posted: 27/05/2006 17:10
by neko iz mase
mali koncept kako bi to trebalo raditi. Na tebi je da ovaj kod debelo optimiziras. Ovo je treca shema, do sad i najlaksa.

Code: Select all

<html>

<head>
<script type="text/javascript">

function change(id){
	var counter;
	var trow
	var ref = document.getElementById('xtable');
	if(id==1){
		for(counter = 1; counter < 4; counter++){
			trow = ref.firstChild.childNodes[counter];
			if (trow.style.display== ""){
				trow.style.display="none";
			}
			else{
				trow.style.display="";
			}
		}
	}
	else if(id==2){
		for(counter = 5; counter < 8; counter++){
			trow = ref.firstChild.childNodes[counter];
			if (trow.style.display== ""){
				trow.style.display="none";
			}
			else{
				trow.style.display="";
			}
		}
	}

}

</script>
</head>

<body>

<table width="170" id="xtable">
	<tr>
		<td><a onclick="change('1')" href="#">Meni link1</a></td>
	</tr>
	<tr style="display: none" >
		<td><a href="#">submenu 1</a></td>
	</tr>
	<tr style="display: none" >
		<td><a href="#">submenu 2</a></td>
	</tr>
	<tr style="display: none" >
		<td><a href="#">submenu 3</a></td>
	</tr>
	<tr>
		<td><a onclick="change('2')" href="#">Meni link2</a></td>
	</tr>
	<tr style="display: none" >
		<td><a href="#">submenu 4</a></td>
	</tr>
	<tr style="display: none" >
		<td><a href="#">submenu 5</a></td>
	</tr>
	<tr style="display: none" >
		<td><a href="#">submenu 6</a></td>
	</tr>
</table>



</body>

</html>

#6

Posted: 27/05/2006 17:12
by Sensei
Već sam iskoristio forUMASH-ov prijedlog, jer mi treba na brzinu. U svakom slučaju, ako imaš već kod neka ga ovdje za arhive. Zatreba to i slično počesto.
Inače, naletio sam na dosta sličnih stvari koje rade, ali uglavnom kombinacija sa CSS-om, ali ipak ovaj gore prijedlog je najjednostavniji.

#7

Posted: 27/05/2006 17:16
by Sensei
neko iz mase wrote:mali koncept kako bi to trebalo raditi. Na tebi je da ovaj kod debelo optimiziras. Ovo je treca shema, do sad i najlaksa.
Izgleda da smo istovremeno postirali, kasnije ću da pogledam kako ovo fercera,pa ako bude to to, mijenjam. Hvala!