Question

当用户触发鼠标悬停事件时，我的代码工作正常，但是我想设置一个定时器来设置动画而不需要任何触发器 - 比如自动动画。我怎么能这样做？

$(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>

这是图书馆：https://nnattawat.github.io/flip/

Answer 1

您需要将触发器值设置为manual，然后检查doc

$(".flip").flip({
    axis: 'y',
    trigger: 'manual'
});

setTimeout( function() {
  $(".flip").flip('toggle');
}, 100); //this will trigger the flip after 100 millisecond

<强>演示

＆＃13;

$(document).ready(function() {

  $(".flip").flip({
    axis: 'y',
    trigger: 'manual'
  });

  setTimeout(function() {
    $(".flip").flip('toggle');
  }, 5000); //this will trigger the flip after 100 millisecond

});

＆＃13;

<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>

＆＃13;

如何使用jQuery Flip为div设置动画

1 个答案: