validare attributo "value"

WpStyle · 3 Lug 2009

sto cercando di validare XHTML 1.0 Strict un mio sito ma mi da questo unico errore:
<li name="1"><a href="index.php">Home</a></li>

si tratta di un menu orizzontale che usa javascript, questa stringa di codice è inserita nel body...
l'effetto è quello di visualizzare sotto al link attivo una linea

potete vederlo online quì:
http://www.saperda.it

lotus · 6 Lug 2009

Ciao, non vorrei sbagliarmi ma il tag li non ha un attributo name

http://www.w3schools.com/TAGS/tag_li.asp

All'indirizzo il dettaglio del tag??

Prova a levare name e poi dimmi con cosa hai provato la validzione

Ciro

Vale_Barbato · 6 Lug 2009

kodemondo ha scritto:
sto cercando di validare XHTML 1.0 Strict un mio sito ma mi da questo unico errore:
<li name="1"><a href="index.php">Home</a></li>

si tratta di un menu orizzontale che usa javascript, questa stringa di codice è inserita nel body...
l'effetto è quello di visualizzare sotto al link attivo una linea

potete vederlo online quì:
http://www.saperda.it

Ciao,
al tag <li> puoi aggiungere un id es. <li id="qualcosa">

Poi il tuo codice lo fare in questo modo:
<li id="1"><a href="/index.php">Home</a></li>

Ciao

WpStyle · 6 Lug 2009

scusatemi....
ho sbagliato a postare il codice, l'attributo non è "name" ma "value"

Codice:

<li value="1"><a href="index.php">Home</a></li>

il codice javascript è:

Codice:

var menuSlider=function(){

	var m,e,g,s,q,i; e=[ ]; q=8; i=8;

	return{

		init:function(j,k){

			m=document.getElementById(j); e=m.getElementsByTagName('li');

			var i,l,w,p; i=0; l=e.length;

			for(i;i<l;i++){

				var c,v; c=e[i]; v=c.value; if(v==1){s=c; w=c.offsetWidth; p=c.offsetLeft}

				c.onmouseover=function(){menuSlider.mo(this)}; c.onmouseout=function(){menuSlider.mo(s)};

			}

			g=document.getElementById(k); g.style.width=w+'px'; g.style.left=p+'px';

		},

		mo:function(d){

			clearInterval(m.tm);

			var el,ew; el=parseInt(d.offsetLeft); ew=parseInt(d.offsetWidth);

			m.tm=setInterval(function(){menuSlider.mv(el,ew)},i);

		},

		mv:function(el,ew){

			var l,w; l=parseInt(g.offsetLeft); w=parseInt(g.offsetWidth);

			if(l!=el||w!=ew){

				if(l!=el){var ld,lr,li; ld=(l>el)?-1:1; lr=Math.abs(el-l); li=(lr<q)?ld*lr:ld*q; g.style.left=(l+li)+'px'}

				if(w!=ew){var wd,wr,wi; wd=(w>ew)?-1:1; wr=Math.abs(ew-w); wi=(wr<q)?wd*wr:wd*q; g.style.width=(w+wi)+'px'}

			}else{clearInterval(m.tm)}

}};}();

il css è questo:

Codice:

.menu{

position:relative;  

width:500px;

float: left;	

margin-top: 12px;

}

.menu ul{

list-style:none; 

z-index:10; 

position:absolute; 

padding:7px 15px;

right: 0px; 

}

.menu li{

float:left;
}

.menu a, .menu a:active, .menu a:visited{

text-decoration:none; 

font-weight: bold;

color:#ffffff; 

padding:10px;
}

.menu a:hover{

color:#ebf0e6;
}

#slide{

position:absolute; 

bottom:0; 

border-bottom:2px solid #ffffff; 

}

e questo l'html:

Codice:

<div class="menu">    
<ul id="menu">

<li value="1"><a href="index.php">Home</a></li>

<li><a href="appartamenti.php?foto=intro&amp;testo=introdesc">Appartamenti</a></li>

<li><a href="prenotazioni.php">Prenotazioni</a></li>

<li><a href="localita.php">Località&amp;</a></li>
<li><a href="info.php">Info</a></li>

<li><a href="contatti.php">Contatti</a></li>
<li id="slide"></li>

</ul>

</div>

praticamente "value" fa in modo che nella barra di navigazione venga evidenziato il link della pagina in cui ci si trova...
è più semplice vederlo in azione quì:
http://webkode.netsons.org/30/

il menu funziona benisimo, l'unico problema che ho è la validazione XHTML 1.0 Strict poichè "value" è deprecato e quindi vorrei trovare un'altra soluzione ma sono bloccato...

Vale_Barbato · 6 Lug 2009

kodemondo ha scritto:

scusatemi....
ho sbagliato a postare il codice, l'attributo non è "name" ma "value"

Codice:

<li value="1"><a href="index.php">Home</a></li>

il codice javascript è:

Codice:

var menuSlider=function(){

	var m,e,g,s,q,i; e=[ ]; q=8; i=8;

	return{

		init:function(j,k){

			m=document.getElementById(j); e=m.getElementsByTagName('li');

			var i,l,w,p; i=0; l=e.length;

			for(i;i<l;i++){

				var c,v; c=e[i]; v=c.value; if(v==1){s=c; w=c.offsetWidth; p=c.offsetLeft}

				c.onmouseover=function(){menuSlider.mo(this)}; c.onmouseout=function(){menuSlider.mo(s)};

			}

			g=document.getElementById(k); g.style.width=w+'px'; g.style.left=p+'px';

		},

		mo:function(d){

			clearInterval(m.tm);

			var el,ew; el=parseInt(d.offsetLeft); ew=parseInt(d.offsetWidth);

			m.tm=setInterval(function(){menuSlider.mv(el,ew)},i);

		},

		mv:function(el,ew){

			var l,w; l=parseInt(g.offsetLeft); w=parseInt(g.offsetWidth);

			if(l!=el||w!=ew){

				if(l!=el){var ld,lr,li; ld=(l>el)?-1:1; lr=Math.abs(el-l); li=(lr<q)?ld*lr:ld*q; g.style.left=(l+li)+'px'}

				if(w!=ew){var wd,wr,wi; wd=(w>ew)?-1:1; wr=Math.abs(ew-w); wi=(wr<q)?wd*wr:wd*q; g.style.width=(w+wi)+'px'}

			}else{clearInterval(m.tm)}

}};}();

il css è questo:

Codice:

.menu{

position:relative;  

width:500px;

float: left;	

margin-top: 12px;

}

.menu ul{

list-style:none; 

z-index:10; 

position:absolute; 

padding:7px 15px;

right: 0px; 

}

.menu li{

float:left;
}

.menu a, .menu a:active, .menu a:visited{

text-decoration:none; 

font-weight: bold;

color:#ffffff; 

padding:10px;
}

.menu a:hover{

color:#ebf0e6;
}

#slide{

position:absolute; 

bottom:0; 

border-bottom:2px solid #ffffff; 

}

e questo l'html:

Codice:

<div class="menu">    
<ul id="menu">

<li value="1"><a href="index.php">Home</a></li>

<li><a href="appartamenti.php?foto=intro&amp;testo=introdesc">Appartamenti</a></li>

<li><a href="prenotazioni.php">Prenotazioni</a></li>

<li><a href="localita.php">Località&amp;</a></li>
<li><a href="info.php">Info</a></li>

<li><a href="contatti.php">Contatti</a></li>
<li id="slide"></li>

</ul>

</div>

praticamente "value" fa in modo che nella barra di navigazione venga evidenziato il link della pagina in cui ci si trova...
è più semplice vederlo in azione quì:
http://webkode.netsons.org/30/

il menu funziona benisimo, l'unico problema che ho è la validazione XHTML 1.0 Strict poichè "value" è deprecato e quindi vorrei trovare un'altra soluzione ma sono bloccato...

Non capisco perchè non fai così:

<div class="menu">
<ul id="menu">
<li ><a href="index.php">Home</a></li>
<li><a href="appartamenti.php?foto=intro&testo=introdesc">Appartamenti</a></li>
<li><a href="prenotazioni.php">Prenotazioni</a></li>
<li><a href="localita.php">Località&</a></li>
<li><a href="info.php">Info</a></li>
<li><a href="contatti.php">Contatti</a></li>
<li id="slide"></li>
</ul>
</div>

Il value="1" e solo per index.php o dev'essere per tutti i tag li ??

WpStyle · 6 Lug 2009

come vedi dal sito nel menu orizzontale scorre tramite javascript una barra sotto ai vari link...
se noti nella Home questa barra si pone sotto al link Home per poi muoversi al passaggio del mouse, se poi vai alla pagina Appartamenti la barra sarà posizionata sotto al link Appartamenti e così via per tutte le pagine...
praticamente è un modo per evidenziare in che pagina ti trovi....

tutto questo è possibile tramite all'attributo "value"...se vedi l'html che ho postato

Codice:

<div class="menu">    
<ul id="menu">
<li value="1"><a href="index.php">Home</a></li>
<li><a href="appartamenti.php?foto=intro&amp;testo=introdesc">Appartamenti</a></li>
<li><a href="prenotazioni.php">Prenotazioni</a></li>
<li><a href="localita.php">Località&amp;</a></li>
<li><a href="info.php">Info</a></li>
<li><a href="contatti.php">Contatti</a></li>
<li id="slide"></li>
</ul>
</div>

evidenzia che sei in home page mentre gli altri tag <li> sono normali, se ti trovi in Appartamenti sarà solo quel link a contenere value=1 e così via per tutti i menu di tutte le pagine...

Codice:

<div class="menu">    
<ul id="menu">
<li><a href="index.php">Home</a></li>
<li value="1"><a href="appartamenti.php?foto=intro&amp;testo=introdesc">Appartamenti</a></li>
<li><a href="prenotazioni.php">Prenotazioni</a></li>
<li><a href="localita.php">Località&amp;</a></li>
<li><a href="info.php">Info</a></li>
<li><a href="contatti.php">Contatti</a></li>
<li id="slide"></li>
</ul>
</div>

Vale_Barbato · 6 Lug 2009

Intanto modifica la larghezza del div menu
impostandolo da 500px a 550px

Inviami i file al mio indirizzo eprsonale [email protected]

così provo da me.

WpStyle · 6 Lug 2009

grazie per l'aiuto...
comunque il problema secondo me sta nel javascript, forse in questa riga:

Codice:

var c,v; c=e[i]; v=c.[COLOR="DarkRed"]value[/COLOR]; if(v==1){s=c; w=c.offsetWidth; p=c.offsetLeft}

Cerca

Cerca

validare attributo "value"

WpStyle

Utente Attivo

lotus

Utente Attivo

Vale_Barbato

Utente Attivo

WpStyle

Utente Attivo

Vale_Barbato

Utente Attivo

WpStyle

Utente Attivo

Vale_Barbato

Utente Attivo

WpStyle

Utente Attivo

Discussioni simili