Question

我有一个鼠标悬停在事件上的元素，我想要动画并向左移动。我有一个我认为是fidle中的正确代码，但它似乎只是工作的动力。

这是我创造的小提琴：

这是我使用的代码 - 简单但基于此它确实应该有效：http://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_animation1

＆＃13;

$(".Submit a").mouseover(function(){
        $(".fadeInLeftBig").animate({left: '750px'});
    });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="animation fadeInLeftBig animated"><img alt="" src="http://younggraphics.com.au/Portals/0/images/skin/car.png" /></div>
<div class="Submit"><a id="dnn_ctr461_FormsView_lnkSubmitEmail" class="Button_default" href='javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions("dnn$ctr461$FormsView$lnkSubmitEmail", "", true, "", "", false, true))'>Submit</a></div>

＆＃13;

Answer 1

要应用left属性，请将元素位置设置为相对于父项的绝对值

.animation{
    position:relative;
}

或使用marginLeft

$(".Submit a").mouseover(function(){
    $(".fadeInLeftBig").animate({marginLeft: '750px'});
});

Answer 2

首先你必须将jQuery作为一个库添加到你的小提琴中，然后如果你想使用left，那么你需要将元素设置为绝对位置，这意味着父元素需要相对位置

<div style="position: relative;">
    <div style="position:absolute;">This div can use the left css</div>
</div>

https://jsfiddle.net/feb8rdwp/5/

Answer 3

可能你应该这样试试：

$('.block').mouseover(function() {       
 $(this).animate({"left": "+=700px"},"slow");
});

你可以在这里试试 - https://jsfiddle.net/dimitrioglo/ebkc9dzL/25/

Answer 4

工作示例：

 <div class="Submit"><a id="dnn_ctr461_FormsView_lnkSubmitEmail" class="Button_default" href='#'>Submit</a></div>

JavaScript：

 $(document).ready(function(ee){    
     $(".Button_default").click(function(){      
        $(".fadeInLeftBig").animate({left: '750px'});
    });  
});

将div中的元素向左移动

4 个答案: