1.获得body宽度
2.任务调度
3.获得div的left
4.设置新的left
$div1.css(‘left’,left+50+‘px’);
5.任务调度结束
<style>
div{
position: absolute;
width: 20px;
height: 20px;
background-color: red;
}
</style>
<body>
<input type="button" id="btn1" value="开始" />
<input type="button" id="btn2" value="结束" />
<div id="div1"></div><br />
</body>
<script src="js/JQuery/jquery-3.4.1.js"></script>
<script>
$(document).ready(function(){
var intervalId;
$('#btn1').on('click',function(){
// 得到body宽度
var width = $('body').innerWidth();
console.log(width);
var $div1 = $('#div1');
// 任务调度
// 开始任务调度
intervalId=window.setInterval(function(){
// 得到div左位置
left = $div1.position().left;
if(left>width-25){
left=0;
}
// 设置新的left
$div1.css('left',left+50+'px');
},100);
});
$('#btn2').on('click',function(){
// 结束任务调度
window.clearInterval(intervalId);
});
});
</script>
结果：
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
