J'essaye d'animer un div lorsque l'utilisateur clique sur le bouton. Chaque bouton déplace un div vers un nombre de pixels différent. Mon code fonctionne dans firefox et chrome mais pas IE8 (je l'ai seulement testé dans IE8 jusqu'à présent). J'apprécie que quelqu'un puisse m'aider à ce sujet.L'animation jQuery ne fonctionne pas dans IE
mon jquery
$(document).ready(function(){
function breakline(position) {
$('#breakline').animate({ //this code won't work...
top:position},'slow');
$('#breakline').hide(); //this code would work. I put it here just for testing
//purpose
};
$('#project a').click(function(){
breakline(256);
});
$('#code a').click(function(){
breakline(200);
});
$('#skill a').click(function(){
breakline(236);
});
$('#about a').click(function(){
breakline(190);
});
$('#contact a').click(function(){
breakline(200);
});
});/* ready */
mon html
<body>
<div id="main">
<div id="menu-wrapper">
<ul id="menu">
<li id="project"><a href="#"></a></li>
<li id="code"><a href="#"></a></li>
<li id="skill"><a href="#"></a></li>
<li id="about"><a href="#"></a></li>
<li id="contact"><a href="#"></a></li>
</ul>
<div id='breakline'> </div>
</div> <!-- menu wrapper -->
</body>
</HTML>
partie de CSS
#breakline
{
width:580px;
height:100px;
background-image:url('breakline.png');
background-repeat:no-repeat;
float:left;
border:1px solid black;
}
Merci patrick.hide() est à des fins de test, je ne vais pas l'utiliser dans mon site réel. copier et coller votre deuxième code, ne fonctionne toujours pas pour moi ... si bizarre ..... + 1 si .. – FlyingCat
@Jerry - Désolé, j'ai oublié que j'avais ajouté 'position: relative' à mes tests. – user113716
Nice !!! ... Merci beaucoup !!!! me demandais la raison d'ajouter la position: relative ....: D – FlyingCat