标签 jquery 下的文章

上周一个朋友让给他解决一个在地图上对应显示省份的问题,才了解到 JVectorMap 这个地图插件;

JVectorMap 是一个优秀的、兼容性强的 jQuery 地图插件。它可以工作在包括 IE6 在内的各款浏览器中,矢量图输出,除官方提供各国地图数据外,用户可以使用数据转换程序定制地图数据。对浏览器的支持:在 Firefox 3 or 4, Safari, Chrome, Opera, IE9 之类的高版本浏览器中使用 SVG 绘制地图;同时也支持老的 ie 浏览器 ie6 到 ie8。

••••••

function tabSlide(obj, objHd, objBd, count, trigger, time){
// obj: Tab 切换最外层
// objHd: Tab 选项卡
// objBd: Tab 内容区
// count: Tab 切换有几个选项卡
// trigger: Tab 切换方式(点击/悬浮)
// time: Tab 自动切换时间
// now: Tab 当前展示区块的索引值,默认第一个开始
    var _this = this;
        _this.obj = obj || ".tabSlide";
        _this.objHd = objHd || ".hd li";
        _this.objBd = objBd || ".bd";
        _this.count = count || 2;
        _this.trigger = trigger || "mouseover";
        _this.time = time || null;
        _this.now = 0;
    var t;
    this.slide = function() {
        $(_this.obj + " " + _this.objHd).bind(_this.trigger, function(event) {
            $(event.target).addClass("on").siblings().removeClass("on");
            var index = $(_this.obj + " " + _this.objHd).index(this);
            $(_this.obj + " " + _this.objBd).eq(index).show().siblings().hide();
            _this.now = index;
            console.log(_this.now);
        })
    }
    this.addhover = function() {
        $(_this.obj).hover(function(){
            clearInterval(t);
        },function(){
            t = setInterval(_this.autoplay, _this.time);
        });
    }
    this.autoplay = function() {
        _this.now = _this.now >= (_this.count-1) ? 0 : ++_this.now;
        $(_this.obj + " " + _this.objHd).eq(_this.now).trigger(_this.trigger);
    }
    this.init = function() {
        this.slide();
        if (_this.time) {
            this.addhover();
            t = setInterval(this.autoplay, _this.time);
        }
    }
    this.init();
}
new tabSlide(".tab",".hd li",".bd .tabBox",2,"click",2000);