jQuery图文分离响应式全屏动画滑点图

时间：2015-08-03 来源：互联网

特效说明：

一款jQuery图文分离响应式全屏动画滑点图网页特效，该JS代码是一款可以左右轮播动画切换焦点图，支持自动轮播，带左右箭头和索引按钮，可自定义设置多个动画滑块元素。（兼容测试：IE7及以上、Firefox、Chrome、Opera、Safari、360等主流浏览器）

使用方法：

1、调用CSS样式：
<link rel="stylesheet" type="text/css" href="css/slide.css"/>

2、调用JS插件代码：
<script src="js/jquery-1.11.3.min.js"></script>
<script src="js/slide.js" type="text/javascript" charset="utf-8"></script>

3、添加HTML代码：
将......之间的html和js代码；放在<body></body>之间。

4、JS代码：
<script type="text/javascript">
    $(document).ready(function() {
        $(".slideInner").slide({
            slideContainer: $('.slideInner a'),
            effect: 'easeOutCirc',
            autoRunTime: 5000,
            slideSpeed: 1000,
            nav: true,
            autoRun: true,
            prevBtn: $('a.prev'),
            nextBtn: $('a.next')
        });
    });
</script>

标签响应式网页特效 jQuery特效动画焦点图图文分离

预览收藏分享评论