jquery使用animate方法实现控制元素移动

2024-05-06 16:17:40

字体：大中小

来源：转载

供稿：网友

这篇文章主要介绍了jquery使用animate方法实现控制元素移动,涉及jQuery中animate方法的使用技巧,具有一定参考借鉴价值,需要的朋友可以参考下

本文实例讲述了jquery使用animate方法实现控制元素移动。分享给大家供大家参考。具体分析如下：

通过jquery的animate方法控制元素移动，这里需要将元素的位置定义为relative, fixed, 或者 absolute!

<!DOCTYPE html>

<html>

<head>

<script src="js/jquery.min.js">

</script>

<script>

$(document).ready(function(){

$("button").click(function(){

$("div").animate({left:'250px'});

});

});

</script>

</head>

<body>

<button>Start Animation</button>

<p>By default, all HTML elements have a static position,

and cannot be moved. To manipulate the position,

remember to first set the CSS position property

of the element to relative, fixed, or absolute!</p>

<div style="background:#98bf21;

height:100px;width:100px;position:absolute;">

</div>

</body>

</html>