jQuery 轮播插件 – GFPlayer

为边锋首页写的一个 jQuery 轮播插件。
借鉴了一些现成的思路,做了优化和修改,不会出现定位错误的问题,不过有同学反馈 IE6 下滑动框不显示。
好久没写过 JS 了,不过倒是复习了一下 jQuery。

  • 11-19 更新:添加自动播放参数
  • 11-17 更新:IE6 显示不正常的原因找到了,原来是它不支持 "__" 下划线开头的 class 名。。。

演示:GFPlayer
下载:GFPlayer

/**
 * Gesion Focus Player
 *
 * @version 1.0.0
 * @author  gesion<gesion@163.com>
 */
(function ($) {
    $.fn.GFPlayer = function (params) {
        params = $.extend({
            autoPlay    : 1,         // 自动播放:0(不自动播放), 1(自动播放)
            showPrev    : 0,         // 向前翻页:0(隐藏), {string}(#id / .class)
            showNext    : 0,         // 向后翻页:0(隐藏), {string}(#id / .class)
            linkStyle   : 'current', // 链接样式:{string}
            showSlider  : 1,         // 显示滑块:1 / true(显示), 0 / false(隐藏)
            showDetail  : 1,         // 显示描述:1 / true(显示), 0 / false(隐藏)
            detailAlpha : 1,         // 描述透明:{int}
            playerSpeed : 'normal',  // 播放速度:fast / normal / slow / {int}(毫秒)
            playerTimer : 3000,      // 播放间隔:{int}(毫秒)
            sliderSpeed : 300,       // 滑动速度:fast / normal / slow / {int}(毫秒)
            sliderTimer : 300        // 滑动响应:{int}(毫秒)
        }, params);

        return this.each(function () {
            $.fn.GFPlayer.start($(this), params);
        });
    };

    /**
     * other code here...
     */
})(jQuery);

使用:

$(function () {
    $("#myFocus").GFPlayer({
        showPrev    : 'a.prev',
        showNext    : 'a.next',
        detailAlpha : .4
    });
});

加入对话

2条评论

电子邮件地址不会被公开。 必填项已用*标注