gpt4 book ai didi

jQuery 动画在 IE 中不起作用

转载 作者:行者123 更新时间:2023-12-01 08:26:46 25 4
gpt4 key购买 nike

我试图在用户单击按钮时为 div 制作动画。每个按钮都会将 div 移动到不同数量的像素。我的代码可以在 firefox 和 chrome 中运行,但不能在 IE8 中运行(到目前为止我只在 IE8 中测试过它)。如果有人能帮助我,我将不胜感激。

我的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 */

我的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>

CSS 的一部分

#breakline
{
width:580px;
height:100px;
background-image:url('breakline.png');
background-repeat:no-repeat;
float:left;
border:1px solid black;
}

最佳答案

如果您将 position:relative 添加到您的样式中,它就可以在 IE8 中运行。

http://jsfiddle.net/NPxt6/1/

#breakline
{
width:580px;
height:100px;
background-image:url('breakline.png');
background-repeat:no-repeat;
float:left;
border:1px solid black;
position:relative;
}​

关于jQuery 动画在 IE 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3223956/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com