87,996
社区成员
发帖
与我相关
我的任务
分享【JQ】jQuery的animate动画效果的左移动无效，右移动有效果
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<script src="file:///C|/Users/qqbnb/Desktop/web/js/jquery-3.1.0.js"></script>
<script>
$(document).ready(function(){
$(".button1").click(function(){
$("p").text("移动文本");
var div=$("div");
div.animate({paddingRight:"10px",opacity:'0.1'},"slow");
div.animate({paddingRight:"0px",opacity:'1'},"slow");
});
$(".button2").click(function(){
$("p").text("变化完毕2222");
var div=$("div");
div.animate({paddingLeft:'50px',opacity:'0.1'},"slow");
div.animate({paddingLeft:'0px',opacity:'1'},"slow");
});
});
</script>
<style>
div{
position:absolute;
top:25%;
left:25%;
}
p{
font-family:"微软雅黑";
font-size:110px;
line-height:95px;}
</style>
</head>
<body>
<button class="button1">UI</button>
<button class="button2">按钮2</button>
<div><p>移动文本</p>
</div>
</body>
</html>
为什么呢，求解答，paddingleft也好，left也好，都没有效果，然是paddingright，right可以生效
谢谢大神
...全文
请发表友善的回复…
发表回复
囧 2016-09-08
- 打赏
- 举报
paddingLeft是向右移动.
div.animate({marginLeft::'-50px',opacity:'0.1'},"slow");
div.animate({marginLeft::'0px',opacity:'1'},"slow");
笨猿 2016-09-08
- 打赏
- 举报
lz，刚测试，用left可以，用的是ff
$(".button1").click(function(){
$("p").text("移动文本");
var div=$("div");
div.animate({left:"10px",opacity:'0.1'},"slow");
div.animate({left:"25%",opacity:'1'},"slow");
});
逝_去_的_光_阴 2016-09-08
- 打赏
- 举报
div{
text-align: center;
}
