/*
此插件基于jquery
插件名:jquery.sonline(在线客服插件)
作者 似懂非懂 版本 2.0 ,协议gpl
blog:www.haw86.com
*/
(function($){
$.fn.sonline = function(options){
var opts = $.extend({}, $.fn.sonline.defualts, options);
$.fn.setlist(opts); //调用列表设置
$.fn.sonline.styletype(opts);
if(opts.defaultsopen == false){
$.fn.sonline.closes(opts.position,0);
}
//展开
//$("#sonlinebox > .opentrigger").live("click",function(){$.fn.sonline.opens(opts);});
//关闭
//$("#sonlinebox > .contentbox > .closetrigger").live("click",function(){$.fn.sonline.closes(opts.position,"fast");});
//live() 方法在 jquery 版本 1.7 中被废弃(1.7也支持on),在版本 1.9 中被移除。请使用 on() 方法代替。
$("#sonlinebox > .opentrigger").on("click", "", function(){
$.fn.sonline.opens(opts);
});
$("#sonlinebox > .contentbox > .closetrigger").on("click",function(){
$.fn.sonline.closes(opts.position,"fast");
});
// 手机和平板端默认收缩
if($(window).width() <= 768){
$.fn.sonline.closes(opts.position,0);
}
//ie6兼容或滚动方式显示
if ($.browser && ($.browser.version == "6.0") && !$.support.style||opts.effect==true) {
$.fn.sonline.scrolltype();
}else if(opts.effect==false){
$("#sonlinebox").css({position:"fixed"});
}
}
//plugin defaults
$.fn.sonline.defualts ={
position:"left",//left或right
top:200,//顶部距离,默认200px
effect:true, //滚动或者固定两种方式,布尔值:true或
width:170,//顶部距离,默认200px
defaultsopen:true, //默认展开:true,默认收缩:false
style:1,//图标的显示风格,默认显示:1
tel:"",//服务热线
title:"在线客服",//服务热线
footertext:'',
website:'',
iconcolor: '#fff',
themecolor: '',
qqlist:"" //多个qq用','隔开,qq和客服名用'|'隔开
}
//展开
$.fn.sonline.opens = function(opts){
var positiontype = opts.position;
$("#sonlinebox").css({width:opts.width+4});
if(positiontype=="left"){$("#sonlinebox > .contentbox").animate({left: 0},"fast");}
else if(positiontype=="right"){$("#sonlinebox > .contentbox").animate({right: 0},"fast");}
$("#sonlinebox > .opentrigger").hide();
$("#sonlinebox").css('overflow','visible');
}
//关闭
$.fn.sonline.closes = function(positiontype,speed){
$("#sonlinebox > .opentrigger").show();
var widthvalue =$("#sonlinebox > .opentrigger").width();
var allwidth =(-($("#sonlinebox > .contentbox").width())-6);
if(positiontype=="left"){$("#sonlinebox > .contentbox").animate({left: allwidth},speed);}
else if(positiontype=="right"){$("#sonlinebox > .contentbox").animate({right: allwidth},speed);}
$("#sonlinebox").css('overflow','hidden').animate({width:widthvalue},speed);
}
//风格选择
$.fn.sonline.styletype = function(opts){
var typenum = 41;
return typenum;
}
//子插件:设置列表参数
$.fn.setlist = function(opts){
$("body").append("
"+opts.title+"
"+opts.footertext+"
");
$("#sonlinebox > .contentbox").width(opts.width)
if(opts.qqlist==""){
$("#sonlinebox > .contentbox > .tels").css("border",0);
}else{
var style = opts.style;
if(1==style){ //传统
$.fn.sonline.showstyle1(opts);
}else if(2==style){ //图标
$.fn.sonline.showstyle2(opts);
}else if(3==style){ //图标+标题
$.fn.sonline.showstyle3(opts);
}
}
if(opts.position=="left"){$("#sonlinebox").css({left:0});}
else if(opts.position=="right"){$("#sonlinebox").css({right:0})}
$("#sonlinebox").css({top:opts.top,width:opts.width+4});
settimeout(function(){
var allheights=0;
if($("#sonlinebox > .contentbox").height() < $("#sonlinebox > .opentrigger").height()){
allheights = $("#sonlinebox > .opentrigger").height()+4;
} else{allheights = $("#sonlinebox > .contentbox").height()+40;}
$("#sonlinebox").height(allheights);
},50)
if(opts.position=="left"){$("#sonlinebox > .opentrigger").css({left:0});}
else if(opts.position=="right"){$("#sonlinebox > .opentrigger").css({right:0});}
}
//滑动式效果
$.fn.sonline.scrolltype = function(){
$("#sonlinebox").css({position:"absolute"});
var topnum = parseint($("#sonlinebox").css("top")+"");
$(window).scroll(function(){
var scrolltopnum = $(window).scrolltop();//获取网页被卷去的高
$("#sonlinebox").stop(true,false).delay(200).animate({top:scrolltopnum+topnum},"slow");
});
}
$.fn.sonline.showstyle1 = function(opts){
var qqlisthtml = $.fn.sonline.splitstr1(opts);
$("#sonlinebox > .contentbox > .listbox").append(qqlisthtml);
}
$.fn.sonline.showstyle2 = function(opts){
var qqlisthtml = $.fn.sonline.splitstr2(opts);
$("#sonlinebox > .contentbox > .listbox").append(qqlisthtml);
$(".sonlinebox2 .contentbox .listbox .item").css({width: opts.width + 'px', 'height': opts.width + 'px', 'line-height': opts.width + 'px', 'color': opts.iconcolor, 'background-color': opts.themecolor})
$(".sonlinebox2 .contentbox .listbox .item i").css("font-size", opts.width / 2 + 'px');
$(".sonlinebox2 .contentbox .listbox .item .triangle").css({top: opts.width / 2 - 7 + 'px'});
$(".sonlinebox2 .contentbox .listbox .item.footer").css('line-height', opts.width + 'px').hover(function(){
$(".sonlinebox2 .contentbox .tels").addclass('show').css('bottom', opts.width / 2 - 25 + 'px');
},function(){
$(".sonlinebox2 .contentbox .tels").removeclass('show');
});
}
$.fn.sonline.showstyle3 = function(opts){
var qqlisthtml = $.fn.sonline.splitstr2(opts);
$("#sonlinebox > .contentbox > .listbox").append(qqlisthtml);
$(".sonlinebox2 .contentbox .listbox .item span.title").css('display', 'block');
$(".sonlinebox2 .contentbox .listbox .item").css({width: opts.width + 'px', 'height': opts.width + 'px', 'color': opts.iconcolor, 'background-color': opts.themecolor})
$(".sonlinebox2 .contentbox .listbox .item i").css({"font-size": opts.width / 2 + 'px'});
$(".sonlinebox2 .contentbox .listbox .item .triangle").css({top: opts.width / 2 - 7 + 'px'});
$(".sonlinebox2 .contentbox .listbox .item.footer").css('line-height', opts.width + 'px').hover(function(){
$(".sonlinebox2 .contentbox .tels").addclass('show').css('bottom', opts.width / 2 - 25 + 'px');
},function(){
$(".sonlinebox2 .contentbox .tels").removeclass('show');
});
}
//分割qq
$.fn.sonline.splitstr1 = function(opts){
var strs= new array(); //定义一数组
var qqlisttext = opts.qqlist;
strs=qqlisttext.split(","); //字符分割
var alt = "";
var qqhtml=""
for (var i=0;i"+substrs[1]+":