Question

我无法设置动画效果。你能帮忙吗？

<script>
$(document).ready(function(){
$('#cats').click(function(){
$(this).animate(
{left:"+=500px'},
1000);
});
</script>
<title>Birman Cats</title>
</head>

<body>
<h1>  Black Cat Superstitions</h1>
<div id="black">
<h2>  Folk Lore</h2>
<div id="cats">
<p><img src="images1/trees.jpg"/></p></div>

Answer 1

您还没有关闭准备好的功能，而且报价不同，您说要选择要设置动画的图片，但是您要定位div，那么，您是否尝试这样做：

$(document).ready(function(){
   $('#cats').click(function(){
      $(this).find('img').animate(
        {left:"+=500px"},
      1000);
   });
});

Answer 2

CSS left仅适用于positioned elements。

因此，只有分配一些职位，您的代码才有效到内部元素。

将您的css代码更改为：

#cats img{
    position:absolute;
    height: 100px;
}

然后将javascript代码直接应用于left样式

$(document).ready(function () {
    $('#cats').click(function () {
        $("#cats img").animate({
            left: "+=500"
        },
        1000);
    });
});

更新fiddle here

Answer 3

工作小提琴=＆gt; http://jsfiddle.net/Lr8GB/，使用margin-left

<script>
$(document).ready(function(){
 $('#cats').click(function(){
      $(this).find('img').animate(
        {'margin-left':"+=500px"},
      1000);
   });
});
</script>

如何选择要制作动画的图像？

3 个答案: