gpt4 book ai didi

jquery - 如何中断 jQuery 动画?

转载 作者:行者123 更新时间:2023-12-01 07:23:17 26 4
gpt4 key购买 nike

当使用 jQuery 单击文档时,我试图通过增加该 div 的 x 位置来为该 div 制作动画。

我不希望 div 在动画时离开我的视线;如果 div 离开了我的屏幕,我想把它带回来。

这是my code :

<!DOCTYPE html>
<html>
<head>
<style type="text/css">
body{
overflow: hidden;
}
div {
position: absolute;
left:10px;
top:10px;
width:20px;
height:20px;
background-color:green;
}
</style>
<script type="text/javascript">
$(function(){
$(document).click(function(){
if($("div").offset().left > (parseInt($(window).width()))){
$("div").animate({"top":'+=20'},1000);
$("div").animate({"left": '8' },1000);
}else{
$("div").animate({"left":'+=400'},1000);
}
});
});
</script>
</head>
<body>
<div></div>
</body>
</html>

最佳答案

引用 http://jsfiddle.net/YV747/3/

$(function(){
$(document).click(function(){
$("#pointer").stop(0,0);

if(($("#pointer").offset().left+100) > $(window).width()){
$("#pointer").animate({"top":'+=20',"left":8},1000);
//$("#pointer").animate({"left": '8' },1000);
}else{
$("#pointer").animate({"left":'+=400'},1000);
}
});
});

查看行 if(($("#pointer").offset().left+100) > $(window).width()){

我给了 100,你可以给 400 或任何适合你的值。

Note: Do not use code on simply div always use id otherwise it will act on all the divs in the document.

关于jquery - 如何中断 jQuery 动画?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11558930/

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