重置jQuery的鼠標移動時，鼠標不再懸停在格

Question

Heyo，

我一直在尋找一個parallax mousemove script有一天，發現這個腳本：

$(document).ready(function() { 
 
    $('#div1').mousemove(function (e) { 
 
     parallax(e, this, 0.5); 
 
     parallax(e, document.getElementById('div2'), 1); 
 
     parallax(e, document.getElementById('div3'), 1.5); 
 
    }); 
 
}); 
 

 
function parallax(e, target, layer) { 
 
    var layer_coeff = 10/layer; 
 
    var x = ($(window).width() - target.offsetWidth)/2 - (e.pageX - ($(window).width()/2))/layer_coeff; 
 
    var y = ($(window).height() - target.offsetHeight)/2 - (e.pageY - ($(window).height()/2))/layer_coeff; 
 
    $(target).offset({ top: y ,left : x }); 
 
};

* { 
 
    margin: 0; 
 
    padding: 0; 
 
} 
 

 
div { 
 
    position: absolute; 
 
    width: 100%; 
 
    height: 100%; 
 
} 
 

 
#div1 { 
 
    background-color: red; 
 
} 
 

 
#div2 { 
 
    background-color: orange; 
 
} 
 

 
#div3 { 
 
    background-color: yellow; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="div1"> 
 
    <div id="div2"></div> 
 
    <div id="div3"></div> 
 
</div>

現在我當鼠標不再徘徊在div1上時，要將腳本重置爲默認位置。我怎麼做？

在此先感謝！

P.S.如果有更好的Script爲此目的隨時發佈。

Answer 1

這不是最好的答案，但是這可能仍然會使用css和transition效果onHover選項您div的實現在最小的方式你的目標，

。

請參閱示例代碼。

單獨使用CSS，

.yourDiv{ 
    /* Put your default styling here */ 
    transition:2s; 
} 

.yourDiv:hover{ 
    /* Put your hover effect here */ 
    margin-left:10px; 
    transition:2s; 
} 

鼠標移開時在你的DIV，它會在與過渡效果的默認樣式顯示您的股利。