jQuery简单实现title提示效果示例

大佬教程收集整理的这篇文章主要介绍了jQuery简单实现title提示效果示例，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。

本文实例讲述了jQuery简单实现title提示效果的方法。分享给大家供大家参考，具体如下：

调用示例： $(document).ready(function(){ $('.quicktip').quberTip({ speed:200 }); }); desktop publishing */ jQuery.fn.quberTip = function (options) { var defaults = { speed: 500,xOffset: 10,yOffset: 10 }; var options = $.extend(defaults,options); return this.each(function () { var $this = jQuery(this); if ($this.attr('title') != undefined) { //Pass the title to a variable and then remove it from DOM if ($this.attr('title') != '') { var tipTitle = ($this.attr('title')); } else { var tipTitle = 'QuberTip'; } //Remove title attribute $this.removeAttr('title'); $(this).hover(function (e) { // $(this).css('cursor','pointer'); $("body").append(""); $("#tooltip").css({ "position": "absolute","z-index": "9999","background": "#D3DDF5","background-image": "url(../../Quber_Image/Quber_Common/Quber_TB_TitltBG.png)","padding": "5px","opacity": "0.9","border": "1px solid #A3C0E8","-moz-border-radius": "3px","border-radius": "3px","-webkit-border-radius": "3px","font-weight": "normal","font-size": "12px","display": "none" }); $("#tooltip") .css("top",(e.pageY + defaults.xOffset) + "px") .css("left",(e.pageX + defaults.yOffset) + "px") .fadeIn(options.speed); },function () { //Remove the tooltip from the DOM $("#tooltip").remove(); }); $(this).mousemove(function (e) { $("#tooltip") .css("top",(e.pageY + defaults.xOffset) + "px") .css("left",(e.pageX + defaults.yOffset) + "px"); }); } }); };

大佬总结

以上是大佬教程为你收集整理的jQuery简单实现title提示效果示例全部内容，希望文章能够帮你解决jQuery简单实现title提示效果示例所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。