easyui的tooltip用来声明元素的提示框
<!DOCTYPE html> <html> <head> <title>jQuery Easy UI</title> <meta charset="UTF-8" /> <script type="text/javascript" src="C:/Users/秋萍/Desktop/easyui/jquery-easyui-1.5.1/jquery.min.js"></script> <script type="text/javascript" src="C:/Users/秋萍/Desktop/easyui/jquery-easyui-1.5.1/jquery.easyui.min.js"></script> <script type="text/javascript" src="C:/Users/秋萍/Desktop/easyui/jquery-easyui-1.5.1/locale/easyui-lang-zh_CN.js" ></script> <link rel="stylesheet" type="text/css" href="C:/Users/秋萍/Desktop/easyui/jquery-easyui-1.5.1/themes/default/easyui.css" /> <link rel="stylesheet" type="text/css" href="C:/Users/秋萍/Desktop/easyui/jquery-easyui-1.5.1/themes/icon.css" /> <script type="text/javascript"> $(function(){ //设置默认值 $.fn.tooltip.defaults.position="top"; $("#href").tooltip({ content : "提示框中的内容", position : "right",//提示框显示的位置 bootom left right top trackMouse : true,//是否允许提示框随鼠标移动 deltaX : 10,// 水平方向提示框的位置 deltaY : 10,// 垂直方向提示框的位置 showDelay :5, //延迟多少毫秒显示提示框 hideDelay : 200 ,//延迟多少毫秒隐藏提示框 showEvent : "mouseenter",//确定激活提示框显示的 事件 默认为mousenter hideEvent :"mouseleave",//确定激活提示框隐藏的事件 默认为mouseleave onShow : function(e){ console.log("在提示框显示的时候触发"); //返回tip 对象 console.log("tip==="+$("#href").tooltip("tip")); }, onHide : function(e){ console.log("在提示框隐藏的时候触发"); }, onUpdate : function(content){ console.log("在提示框中的内容改变的时候触发"); }, onPosition : function(left,right){ console.log("当提示框的位置改变的时候触发"); }, onDestory : function(){ console.log("当提示框被销毁的时候触发"); } //console.log($("#href").tooltip("options")); //$("#href").tooltip("show")显示提示框 //$("#href").tooltip("hide")隐藏提示框 //$("#href").tooltip('update','更新后的提示内容'); //$("#href").tooltip("destroy");销毁提示框 //$("#href").tooltip("reposition");重置提示框 }); }); </script> </head> <body> <a href="#" title="超链接" class="easyui-tooltip">干我干我嘛</a> <a id="href" href="#" class="easyui-tooltip">OOXX</a> </body> </html>
posted on
