Ho leggermente modificato nei fogli di stile l'esempio di hover animato presente su un sito, i tutorial jquery, funziona ma non carica l'immagine animata, appare solo il testo presente tra i tag em:
codice:
<script type="text/javascript" src="./js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".link_an").hover(function() {
$(this).next("em").animate({opacity: "show", top: "-75"}, "slow");
}, function() {
$(this).next("em").animate({opacity: "hide", top: "-85"}, "fast");
});
});
</script>
<style type="text/css">
.link_an em {
background: url(hover.png) no-repeat;
width: 180px;
height: 45px;
position: absolute;
left: -15px;
text-align: center;
padding: 20px 12px 10px;
font-style: normal;
text-indent: -900em;
display: none;top: -85px;
}
</style>
<div id="siti">
<h4>Siti Preferiti</h4>
<ul>[*]nome sito
<em style="top: -85px; display: none;">sito associazione[/i]
[/list]
</div>
Forse dipende dal foglio di stile del menu?
codice:
#siti {
width: 240px;
padding-top: 23px;
margin-left: 15px;
}
#siti h4 {
background: url(images/link_pref.gif) no-repeat;
text-indent: -900em;
clear: both;
}
#siti ul {
margin: 0;
padding: 8px 0 0 0;
}
#siti ul li {
background: url(images/check.gif) no-repeat left 2px;
padding: 0 0 15px 18px;
font: italic 1.2em Georgia, "Times New Roman", Times, serif;
} {
Spero che abbiate capito il problema.
Nicola