Inezia -> div visibility

**Il_Male** · 21-04-2013, 11:11

Perchè quando passo sul primo div (Aout) mi cambia correttamente lo sfondo solo al div (A) mentre quando passo sul secondo (Bout) mi cambia lo sfondo sia ad A che a B?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>div</title>
<style>
body, html { font-family: Tahoma, verdana, arial, helvetica, sans-serif;font-size:14px;}
a:link.menudiv, a:visited.menudiv {font-weight: normal; color:#ffffff; font-size: 12px; text-decoration: none; margin:2px}
a:hover.menudiv {font-weight: normal; color:#cccccc; font-size: 14px; text-decoration: none; margin:2px}
</style>
<script type="text/javascript">
function showmenu(elmnt)
{
document.getElementById(elmnt).style.visibility="v isible"
}
function hidemenu(elmnt)
{
document.getElementById(elmnt).style.visibility="h idden"
}
</script>
</head>
<body>
<div id="Aout" style="position: relative; border:1px solid #000099; width:530px;height:147px; background-color:#FFCCFF;" onmouseover="showmenu('A')" onmouseout="hidemenu('A')">
<div Id="A" style="width:530px;height:107px; padding:0px; background-color:#990000; visibility:hidden;">
<div style="padding:10Px;text-align:left;">
<span style="color: white">» </span>» </span><a class=menudiv href=#>Abbbb

<span style="color: white">» </span><a class=menudiv href=#>Acccc</a>
</div>
</div>
<div style="width:530px;height:40px;position:absolute;b ottom:0px;right:0px;text-align:right;}">
<span style="color:black;font-size:40px;">Aaaaaaaaaa</span>
<div>
</div>

<div id="Bout" style="position: relative; border:1px solid #000099; width:530px;height:147px; background-color:#CCCCFF;" onmouseover="showmenu('B')" onmouseout="hidemenu('B')">
<div Id="B" style="width:530px;height:107px; padding:0px; background-color:#003399;visibility:hidden;">
<div style="padding:10Px;text-align:left;">
<span style="color: white">» </span>» </span><a class=menudiv href=#>Bbbbb

<span style="color: white">» </span><a class=menudiv href=#>Bcccc</a>
</div>
</div>
<div style="width:530px;height:40px;position:absolute;b ottom:0px;right:0px;text-align:right;}">
<span style="color:black;font-size:40px;">Bbbbbbbbb</span>
<div>
</div>
</body>
</html>

**cavicchiandrea** · 21-04-2013, 11:45

Usa sempre i tasti [c o d e] o [p h p] per postare il codice

codice:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>div</title>
<style>
body, html  { font-family: Tahoma, verdana, arial, helvetica, sans-serif;font-size:14px;}
a:link.menudiv, a:visited.menudiv {font-weight: normal; color:#ffffff; font-size: 12px; text-decoration: none; margin:2px}
a:hover.menudiv {font-weight: normal; color:#cccccc; font-size: 14px; text-decoration: none; margin:2px}
</style>
<script type="text/javascript">
function showmenu(elmnt)
{
document.getElementById(elmnt).style.visibility="visible"
}
function hidemenu(elmnt)
{
document.getElementById(elmnt).style.visibility="hidden"
}
</script>
    </head>
    <body>
        <div id="Aout" style="position: relative; border:1px solid #000099; width:530px;height:147px; background-color:#FFCCFF;" onmouseover="showmenu('A')" onmouseout="hidemenu('A')">
            <div Id="A" style="width:530px;height:107px; padding:0px; background-color:#990000; visibility:hidden;">
                <div style="padding:10Px;text-align:left;">
					<span style="color: white">&raquo; </span>&raquo; </span><a class=menudiv href=#>Abbbb

					<span style="color: white">&raquo; </span><a class=menudiv href=#>Acccc</a>
                </div>
            </div> 
            <div style="width:530px;height:40px;position:absolute;bottom:0px;right:0px;text-align:right;}">
            	<span style="color:black;font-size:40px;">Aaaaaaaaaa</span>
            <div><--- questo deve essere una chiusura (</div>)
        </div>


        <div id="Bout" style="position: relative; border:1px solid #000099; width:530px;height:147px; background-color:#CCCCFF;" onmouseover="showmenu('B')" onmouseout="hidemenu('B')">
            <div Id="B" style="width:530px;height:107px; padding:0px; background-color:#003399;visibility:hidden;">
                <div style="padding:10Px;text-align:left;">
					<span style="color: white">&raquo; </span>&raquo; </span><a class=menudiv href=#>Bbbbb

					<span style="color: white">&raquo; </span><a class=menudiv href=#>Bcccc</a>
                </div>
            </div> 
            <div style="width:530px;height:40px;position:absolute;bottom:0px;right:0px;text-align:right;}">
            	<span style="color:black;font-size:40px;">Bbbbbbbbb</span>
            <div><--- questo deve essere una chiusura (</div>)
        </div>
    </body>
</html>

delimita sempre il valore degli attribuiti class="menudiv" href="#" usa sempre il minuscolo Id, ripassa i css

P.S. queste "transizioni/animazioni" puoi farle con i css3 senza l'uso di js

**Il_Male** · 21-04-2013, 13:37

Grazie mille!

marco

Discussione: Inezia -> div visibility

Strumenti discussione

Ricerca discussione

Visualizza

Inezia -> div visibility

Re: Inezia -> div visibility

Permessi di invio