不知道大家对 plugin animsition有多少了解，本文通过实例代码给大家分享了jquery plugin animsition用法，非常不错，具有参考借鉴价值，需要的朋友参考下吧，希望能帮助到大家。
用法整理
实现的效果是，各种不同效果的转场效果
<p class="animsition">   <p class="item bg-indigo">    <h1>animsition: sandbox</h1>   </p>   <h2>defaults</h2>   <ol>    <li><a class="animsition-link" data-animsition-out-class="rotate-out" data-animsition-out-duration="500" href="page1.html" rel="external nofollow" >basic</a></li>    <li><a class="animsition-link" data-animsition-out-class="rotate-out" data-animsition-out-duration="500" href="page2.html" rel="external nofollow" >options</a></li>   </ol>  </p> <script src="jquery-3.2.1.min.js"></script>   <script src="js/animsition.js"></script>  <script>   $(document).ready(function() {  $(.animsition).animsition({   inclass: 'flip-in-y',   outclass: 'flip-out-y',   induration: 1500,   // outduration: 800,   linkelement: '.animsition-link',   // e.g. linkelement: 'a:not([target=_blank]):not([href^=#])'   loading: false,   loadingparentelement: 'body', //animsition wrapper element   loadingclass: 'animsition-loading',   loadinginner: '', // e.g '<img src="loading.svg" />'   timeout: false,   timeoutcountdown: 5000,   onloadevent: true,   browser: [ 'animation-duration', '-webkit-animation-duration'],   // browser option allows you to disable the animsition in case the css property in the array is not supported by your browser.   // the default setting is to disable the animsition in a browser that does not support animation-duration.   overlay : false,   overlayclass : 'animsition-overlay-slide',   overlayparentelement : 'body',   // transition: function(url){ window.location.href = url;}  }); });   </script>
注意！！！css文件的.animistion类的opacity设置了为0；需要改过来，要不然页面元素看不到！！！
相关推荐：
jquery ui 日期选择器datepicker详解
jquery实现表格前端排序功能详解
实例详解jquerymobile窗体长内容的缺陷与解决方法
以上就是实例分享jquery plugin animsition使用小结的详细内容。