初次提交

master
有名堂 2 years ago
commit 4c9699d1bb

@ -0,0 +1,8 @@
.sTips {
position: absolute;
padding: 2px;
border: 1px solid #ccc;
padding: 5px;
max-width: 400px;
background-color: #fff;
}

@ -0,0 +1,220 @@
/*
jQuery 鼠标提示插件 v2.0
https://github.com/28269890/sTips
Demohttps://28269890.github.io/sTips
*/
(function($){
$.fn.sTips = function(options) {
var o = $.extend({}, $.fn.sTips.defaults,options);
if($("#_sTips").length==0){
$("body").append("<div id='_sTips'></div>");
}
$("#_sTips").hide();
$("#_sTips").bind({
mouseenter:function(){
$("#_sTips").stop(true).fadeTo(o.inTime,o.phy);
},
mouseleave:function(){
$("#_sTips").fadeOut(o.outTime);
}
});
var sTipsPosition = function(e){
var s = $(e).offset();
var x = s.left;
var y = s.top - $("#_sTips").outerHeight();
if(o.position=="1"){
x = s.left - $("#_sTips").outerWidth();
y = s.top - $("#_sTips").outerHeight();
}
if(o.position=="11"){
x = s.left;
y = s.top - $("#_sTips").outerHeight();
}
if(o.position=="12"){
x = s.left - $("#_sTips").outerWidth();
y = s.top;
}
if(o.position=="2"){
x = s.left + $(e).outerWidth();
y = s.top - $("#_sTips").outerHeight();
}
if(o.position=="21"){
x = s.left + $(e).outerWidth() - $("#_sTips").outerWidth();
y = s.top - $("#_sTips").outerHeight();
}
if(o.position=="22"){
x = s.left + $(e).outerWidth();
y = s.top;
}
if(o.position=="3"){
x = s.left + $(e).outerWidth();
y = s.top + $(e).outerHeight();
}
if(o.position=="31"){
x = s.left + $(e).outerWidth();
y = s.top + $(e).outerHeight() - $("#_sTips").outerHeight();
}
if(o.position=="32"){
x = s.left + $(e).outerWidth() - $("#_sTips").outerWidth();
y = s.top + $(e).outerHeight();
}
if(o.position=="4"){
x = s.left - $("#_sTips").outerWidth();
y = s.top + $(e).outerHeight();
}
if(o.position=="41"){
x = s.left - $("#_sTips").outerWidth();
y = s.top + $(e).outerHeight() - $("#_sTips").outerHeight();
}
if(o.position=="42"){
x = s.left ;
y = s.top + $(e).outerHeight();
}
$("#_sTips").css({
"left": x,
"top": y
});
}
this.each(function(){
var _this = this
if(this.alt){this.sTips=this.alt;$(this).removeAttr("alt")};
if(this.title){this.sTips=this.title;$(this).removeAttr("title")};
if(this.sTips==undefined){return};
var titlelength = this.sTips.indexOf("{||}")
if(titlelength > 0){
this.sTipsTop = this.sTips.substr(0,titlelength);
this.sTipsBody = this.sTips.substr(titlelength + 4,this.sTips.length);
}else{
this.sTipsBody = this.sTips;
}
$(this).on({
mousemove:function(e){
if (o.mouse==0){
return;
}
var x = e.pageX;
var y = e.pageY;
if (o.mouse==1){
x -= (o.mousez + $("#_sTips").outerWidth());
y -= (o.mousez + $("#_sTips").outerHeight());
}else if (o.mouse==2){
x += o.mousez;
y -= (o.mousez + $("#_sTips").outerHeight());
}else if(o.mouse==3){
x += o.mousez;
y += o.mousez;
}else if(o.mouse==4){
x -= (o.mousez + $("#_sTips").outerWidth());
y += o.mousez;
}
if(x + $("#_sTips").outerWidth() >= document.body.clientWidth){
x = document.body.clientWidth - $("#_sTips").outerWidth() ;
};
if(y + $("#_sTips").outerHeight() >= document.body.clientHeight){
y = document.body.clientHeight - $("#_sTips").outerHeight() ;
};
if (x < 0){x=0}
if (y < 0){y=0}
$("#_sTips").css({
"left": x,
"top": y
});
},
mouseenter: function() {
$("#_sTips").hide();
$("#_sTips").stop();
$("#_sTips").html("");
if(this.sTipsTop){
$("#_sTips").prepend("<div id='_sTips_Top' class='"+o.topCss+"'>"+this.sTipsTop+"</div>");
$("#_sTips_Top").addClass(o.topCss);
}
$("#_sTips").append("<div id='_sTips_body' class='"+o.bodyCss+"'></div>");
$("#_sTips").addClass(o.sTipsCss);
$("#_sTips").css("z-index",99999999999);
if (this.sTipsBody.substr(0, 5)=="ajax:"){
$("#_sTips_body").html(o.ajaxloading);
$.ajax({
url: this.sTipsBody.substr(5,this.sTipsBody.length),
dataType: 'html',
global:false,
error: function(xhr,error){
if(error == 'error'){
if(o.ajaxerror != "off"){
$("#_sTips_body").html("AJAX错误" + xhr.statusText + "");
sTipsPosition(_this)
}
}
},
success: function(shtml){
$("#_sTips_body").html(shtml);
sTipsPosition(_this)
}
});
}else if(this.sTipsBody.substr(0, 3)=="fn:"){
var html=eval(this.sTipsBody.substr(3,this.sTipsBody.length))
if(html){
$("#_sTips_body").html(html);
}
}
else{
$("#_sTips_body").html(this.sTipsBody);
};
sTipsPosition(this)
$("#_sTips").fadeTo(o.inTime,o.phy);
},
mouseleave: function(){
$("#_sTips").fadeOut(o.outTime);
}
});
});
};
//--这里的都是初始值,能够设定的内容也都在这里
$.fn.sTips.defaults = {
phy:1, //透明度 0-1
inTime:200,//淡入时间
outTime:200,//淡出时间
sTipsCss:"sTips",//给外框指定css样式
topCss:"sTip-Top",//给提示框头部指定css样式值为css名称
bodyCss:"sTips-Body",//给主提示框指定css样式值为css名称
ajaxError:"",//ajax错误提示开关唯一值off
ajaxLoading:"loading...",//ajax读取之前的信息也可修改成图片例如<img src="loading.gif">
position:2,//位置:角+排列 1左上2右上3右下4左下,排列1 2 从左到右,从上到下。
mousez:10,//提示框和鼠标之间的距离
mouse:0//鼠标跟随。1左上2右上3左下4右下
};
})(jQuery);

1
sTips.min.css vendored

@ -0,0 +1 @@
.sTips{position:absolute;padding:2px;border:1px solid #ccc;padding:5px;max-width:400px;background-color:#fff}

1
sTips.min.js vendored

@ -0,0 +1 @@
!function($){$.fn.sTips=function(options){var o=$.extend({},$.fn.sTips.defaults,options);0==$("#_sTips").length&&$("body").append("<div id='_sTips'></div>"),$("#_sTips").hide(),$("#_sTips").bind({mouseenter:function(){$("#_sTips").stop(!0).fadeTo(o.inTime,o.phy)},mouseleave:function(){$("#_sTips").fadeOut(o.outTime)}});var sTipsPosition=function(e){var s=$(e).offset(),x=s.left,y=s.top-$("#_sTips").outerHeight();"1"==o.position&&(x=s.left-$("#_sTips").outerWidth(),y=s.top-$("#_sTips").outerHeight()),"11"==o.position&&(x=s.left,y=s.top-$("#_sTips").outerHeight()),"12"==o.position&&(x=s.left-$("#_sTips").outerWidth(),y=s.top),"2"==o.position&&(x=s.left+$(e).outerWidth(),y=s.top-$("#_sTips").outerHeight()),"21"==o.position&&(x=s.left+$(e).outerWidth()-$("#_sTips").outerWidth(),y=s.top-$("#_sTips").outerHeight()),"22"==o.position&&(x=s.left+$(e).outerWidth(),y=s.top),"3"==o.position&&(x=s.left+$(e).outerWidth(),y=s.top+$(e).outerHeight()),"31"==o.position&&(x=s.left+$(e).outerWidth(),y=s.top+$(e).outerHeight()-$("#_sTips").outerHeight()),"32"==o.position&&(x=s.left+$(e).outerWidth()-$("#_sTips").outerWidth(),y=s.top+$(e).outerHeight()),"4"==o.position&&(x=s.left-$("#_sTips").outerWidth(),y=s.top+$(e).outerHeight()),"41"==o.position&&(x=s.left-$("#_sTips").outerWidth(),y=s.top+$(e).outerHeight()-$("#_sTips").outerHeight()),"42"==o.position&&(x=s.left,y=s.top+$(e).outerHeight()),$("#_sTips").css({left:x,top:y})};this.each((function(){var _this=this;if(this.alt&&(this.sTips=this.alt,$(this).removeAttr("alt")),this.title&&(this.sTips=this.title,$(this).removeAttr("title")),null!=this.sTips){var titlelength=this.sTips.indexOf("{||}");titlelength>0?(this.sTipsTop=this.sTips.substr(0,titlelength),this.sTipsBody=this.sTips.substr(titlelength+4,this.sTips.length)):this.sTipsBody=this.sTips,$(this).on({mousemove:function(e){if(0!=o.mouse){var x=e.pageX,y=e.pageY;1==o.mouse?(x-=o.mousez+$("#_sTips").outerWidth(),y-=o.mousez+$("#_sTips").outerHeight()):2==o.mouse?(x+=o.mousez,y-=o.mousez+$("#_sTips").outerHeight()):3==o.mouse?(x+=o.mousez,y+=o.mousez):4==o.mouse&&(x-=o.mousez+$("#_sTips").outerWidth(),y+=o.mousez),x+$("#_sTips").outerWidth()>=document.body.clientWidth&&(x=document.body.clientWidth-$("#_sTips").outerWidth()),y+$("#_sTips").outerHeight()>=document.body.clientHeight&&(y=document.body.clientHeight-$("#_sTips").outerHeight()),x<0&&(x=0),y<0&&(y=0),$("#_sTips").css({left:x,top:y})}},mouseenter:function(){if($("#_sTips").hide(),$("#_sTips").stop(),$("#_sTips").html(""),this.sTipsTop&&($("#_sTips").prepend("<div id='_sTips_Top' class='"+o.topCss+"'>"+this.sTipsTop+"</div>"),$("#_sTips_Top").addClass(o.topCss)),$("#_sTips").append("<div id='_sTips_body' class='"+o.bodyCss+"'></div>"),$("#_sTips").addClass(o.sTipsCss),$("#_sTips").css("z-index",99999999999),"ajax:"==this.sTipsBody.substr(0,5))$("#_sTips_body").html(o.ajaxloading),$.ajax({url:this.sTipsBody.substr(5,this.sTipsBody.length),dataType:"html",global:!1,error:function(xhr,error){"error"==error&&"off"!=o.ajaxerror&&($("#_sTips_body").html("AJAX错误"+xhr.statusText),sTipsPosition(_this))},success:function(shtml){$("#_sTips_body").html(shtml),sTipsPosition(_this)}});else if("fn:"==this.sTipsBody.substr(0,3)){var html=eval(this.sTipsBody.substr(3,this.sTipsBody.length));html&&$("#_sTips_body").html(html)}else $("#_sTips_body").html(this.sTipsBody);sTipsPosition(this),$("#_sTips").fadeTo(o.inTime,o.phy)},mouseleave:function(){$("#_sTips").fadeOut(o.outTime)}})}}))},$.fn.sTips.defaults={phy:1,inTime:200,outTime:200,sTipsCss:"sTips",topCss:"sTip-Top",bodyCss:"sTips-Body",ajaxError:"",ajaxLoading:"loading...",position:2,mousez:10,mouse:0}}(jQuery);
Loading…
Cancel
Save