Onmouseover

[Xx_Prince_xX]

Ciao intanto a tutta la community,
Vorrei sapere come fare per espandere un "oggetto" quando ci passa sopra il mouse, un esempio questo sito http://ffmagazine.forumfree.it/#nb (nei link di accedi/registrati) oppure vorri sapere se come farsì che "quell'oggetto" si muova al passaggio del mouse (nei link di facebook twitter ecc..), è una jquery?

Grazie a tutti ^^

[webdemo]

sposto in JS

[Xx_Prince_xX]

Scusate per la sezione sbagliata, ma nessuno sa aiutarmi?

[Xx_Prince_xX]

Up

[Xx_Prince_xX]

Up

[lucavizzi]

la sezione giusta sarebbe "CSS" non javascript.

se vuoi espandere un link:
Accedi
Registrati

a.espandi{
display:block;
width:150px;
padding:10px 20px;
}
a.espandi:hover{
padding:10px 40px;
}

nei link di facebook e twitter invece dovresti agire sul margin-top.

[Xx_Prince_xX]

Grazie mille per la risposta, ma ho comunque un problema, se aumento il padding, il "blocco" non scorre, me si sposta radicalmente, come posso farsi che scorra? penso sia un problema che riguarda js

[lucavizzi]

Non è necessario js per impostare lo stato di hover di un anchor, anche nei vecchi browser l'hover è supportato per i tag 'a'.

Posta un link alla pagina.

[alessadrop58]

nn è difficile ... basta giocare un po cn le proprietà dell'oggetto che vuoi modificare:

<script>
function aumentaDim(idElementoDaModificare, width)
{
var el=document.getElementById(idElementoDaModificare);
var nL=parseInt(el.style.width);
if(width>nL)
{
var w=width-nL;
}else
{
var w=nL-width;
}
var u=w/10;
var myw=width+u
window.setTimeout("document.getElementById('"+el.id+"').style.width='"+myw+"px'",100);
myw=myw+u
window.setTimeout("document.getElementById('"+el.id+"').style.width='"+myw+"px'",200);
myw=myw+u
window.setTimeout("document.getElementById('"+el.id+"').style.width='"+myw+"px'",300);
myw=myw+u
window.setTimeout("document.getElementById('"+el.id+"').style.width='"+myw+"px'",400);
myw=myw+u
window.setTimeout("document.getElementById('"+el.id+"').style.width='"+myw+"px'",500);
myw=myw+u
window.setTimeout("document.getElementById('"+el.id+"').style.width='"+myw+"px'",600);
myw=myw+u
window.setTimeout("document.getElementById('"+el.id+"').style.width='"+myw+"px'",700);
myw=myw+u
window.setTimeout("document.getElementById('"+el.id+"').style.width='"+myw+"px'",800);
myw=myw+u
window.setTimeout("document.getElementById('"+el.id+"').style.width='"+myw+"px'",900);
myw=myw+u
window.setTimeout("document.getElementById('"+el.id+"').style.width='"+myw+"px'",1000);

}
</script>
<div id="prova" style="border:1px solid #000000; width:50px; height:30px;'" onmouseover="aumentaDim(this.id, 100)"></div>

[Xx_Prince_xX]

Vabbene ho risolto con la proprietà -moz-transition nel css ^^

Grazie a tutti lo stesso!