AnythingSlider - 一 款基于jQuery的焦点图轮番切换插件
  • 分享到微信朋友圈
    X

关于AnythingSlider

AnythingSlider是一款功能强大且易于使用的jQuery滑块插件,用于在网页中创建各种类型的滑动面板,如图片轮播、导航菜单、文章列表等。

如何使用AnythingSlider

步骤1:引入css文件

引入 anythingslider.css

<link rel="stylesheet" href="css/anythingslider.css">

步骤2:使用HTML初始化

<div class="slider">
    <ul>
        <li>
            <img src="image1.jpg" alt="Image 1" /></li>
        <li>
            <img src="image2.jpg" alt="Image 2" /></li>
        <li>
            <img src="image3.jpg" alt="Image 3" /></li>
    </ul>
</div>

步骤3:调用anythingslider。

<script src="js/jquery.js"></script>
<script src="js/jquery.anythingslider.js"></script>
<script type="text/javascript">
    $(window).load(function () {
        $('#slider').anythingSlider({
            easing: 'easeInOutCubic',
            startAt: 1,
            buildArrows: true,
            buildNavigation: true
        });
    });
</script>

参数说明

参数说明http://css-tricks.github.io/AnythingSlider/index.html