当用户触发鼠标悬停事件时,我的代码工作正常,但是我想设置一个计时器以在没有任何触发器的情况下进行动画处理 - 就像自动动画处理一样。我该怎么做?
$(document).ready(function() {
$(".flip").flip({
axis: 'y',
trigger: 'hover'
});
});
<div class=" flip col-md-3">
<div class="flip">
<div class="front">
<div class="title">Front Wise</div>
</div>
<div class="back">
<div class="title">Back Wise</div>
</div>
</div>
</div>
最佳答案
需要设置trigger值为manual
,勾选doc
$(".flip").flip({
axis: 'y',
trigger: 'manual'
});
setTimeout( function() {
$(".flip").flip('toggle');
}, 100); //this will trigger the flip after 100 millisecond
演示
$(document).ready(function() {
$(".flip").flip({
axis: 'y',
trigger: 'manual'
});
setTimeout(function() {
$(".flip").flip('toggle');
}, 5000); //this will trigger the flip after 100 millisecond
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.rawgit.com/nnattawat/flip/master/dist/jquery.flip.js"></script>
Flip below will be triggered in 5 seconds
<div class=" flip col-md-3">
<div class="flip">
<div class="front">
<div class="title">Front Wise</div>
</div>
<div class="back">
<div class="title">Back Wise</div>
</div>
</div>
</div>
关于javascript - 如何使用 jQuery Flip 为 div 设置动画,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47415870/