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!