jquery滑过提示插件

使用JQuery制作了个滑过提示的插件，如果你的页面加载了jquery库那么使用它你将可以很简单的制作一个滑过提示的页面。

此处为Javascript代码

$.plug={
	alt: function(_alt) {
		_alt = $.fn.extend({
		name: "title",
		id: "*",
		effect: 3
	},
	_alt);//定义默认参数
	$("" + _alt.id + "[" + _alt.name + "]").die().live({//绑定事件
		mouseover: function(e) {//划入则输出个DIV
			$("body").append("<div id='alt_title' style='padding: 10px;position: absolute;background-color: #FAF1D6;border: 1px solid #09F;z-index:999;display:none'>" + $(this).attr("" + _alt.name + "") + "</div>")
		},
		mousemove: function(e) {//在ID内移动则改变CSS
			var _a = $("#alt_title");
			var _y = e.pageY + 20;
			var _x = e.pageX + 10;
			_a.css({
			"left": "" + _x + "px",
			"top": "" + _y + "px"
			});
			if (_a.is(":hidden")) {
			if (_alt.effect == 1) {
			_a.fadeIn(300)
			} else if (_alt.effect == 2) {
			_a.show(300)
			} else if (_alt.effect == 3) {
			_a.slideDown(300)
			} else {
			alert("滑过提示插件参数'effect'写入失败；");
			return false
			}
			}
		},
		mouseleave: function() {//划出则删除DOM
			$("#alt_title").remove()
		}
	})
	}	
}

 

使用的时候：

$.plug.alt({name:"x",id:"div.1",effect:1});

参数说明：

name:必填项目，这个是要提示内容的名称，这个比如在标签内，如<div xl="提示的内容">那么这个name就是xl

id:可选项，这个是要滑过哪个容器，比如div,a,span,p等，支持写 选择器，比如id:"div#id",id:"span.class"等，越精确越快，默认为*所有

effect:可选项，数字类型，有1，2，3选择，1为淡入fadeIn，2为渐变显示show，3为下拉显示。默认为1

效果请看例子：http://www.xuexb.com/demo/hover.html

学习吧原创插件，转载请注明。