点击HTML页面问号出现提示框（附源码）

本demo的功能：点击页面按钮在其边缘出现提示信息，点击页面任何一处则消失。

如下图：

jquery插件；

layer插件；

==注意==：

>

data-tips属性是必须的。

data-tips属性中：type： 1 不用修改；

data-tips属性中：txt内容即是要提示的内容。

 html  head  link rel= stylesheet href= style.css type= text/css /  /head  body  div >3.css内容：（非必要）
本demo的css非必须，不影响功能；
.edi-icon { font-size: 18px; font-style: normal; -webkit-font-smoothing: antialiased; -webkit-text-stroke-width: .2px; -moz-osx-font-smoothing: grayscale; *display: inline; *zoom: 1; cursor: pointer;}
4.javascript内容：（核心）
//定义提示弹出框；var helpTipsLayer;//定义弹出框的默认设置；function helpTips(t) { this.options = {},  this.options.elem = .j-help-tips , //与页面class相对应； this.options.type = 1,  this.options.color = #8db3d7 ,  this.options.time = 0, //设置0是提示弹出框不会自动消失；可设置为其他数字，以毫秒为单位； this.options.titleEnd = 录入提示 ,  this.options.width = 600px ,  this.options.height = ,  this.options.imgWidth = 233 ,  this.options.imgHeight = 375 ,  undefined != typeof t (this.options = $.extend({}, this.options, t)),  this.elemObj = $(this.options.elem)function() { //点击页面任何一处可使提示弹出框消失； $(document).on( click , function(event){ var e = event || window.event; var target = e.target || e.srcElement; var flag = $(target).hasClass( j-help-tips  if(helpTipsLayer !flag){ layer.close(helpTipsLayer);}(), helpTips.prototype = { constructor : helpTips, init : function() { this.bindEvent() bindEvent : function() { var t = this; t.elemObj.on( click , function() { layer.close(helpTipsLayer);//点击其他任意的提示框按钮，则关闭上一个提示框。 var i = $(this), o = i.data( tips  if ( undefined != typeof o undefined != typeof o.type 1 == o.type) { undefined != typeof o undefined != typeof o.txt ? helpTipsLayer = layer.tips(o.txt, i, { tips : [ t.options.type, t.options.color ], time : t.options.time }) : t.log() } else { if ( undefined != typeof o.title undefined != typeof o.txt undefined != typeof o.img) { var e = p >
以上就是点击HTML页面问号出现提示框（附源码）的详细内容，html教程        
郑重声明：本文版权归原作者所有，转载文章仅为传播更多信息之目的，如作者信息标记有误，请第一时间联系我们修改或删除，多谢。