Html中，如设置了title的属性，则当鼠标在该对象上面短暂的停留时，会显示预设的文本提示，但，这些效果只会短暂的显示，一会就会消失，又要重新把鼠标移出再移回来才被显示，样式也无法重写，实在是恼人之极。可喜的是，咱IT界人才辈出，这不，有一个专门针对这提示框的控件出现了，我用了一阵子，效果还可以，于是赶紧记下来，怕以后不用忘记了，下面是一张效果图：

图一、poshytip控件效果

那怎么用呢，很简单：

第一、把poshytip控件下载到项目中，并引入到需要调用的页面，图二为我的js与poshytip的文件结构：

图二、文件结构

第二、下面为需要引入poshytip的文件关键代码：

<head id="Head1" runat="server">

     <link rel="stylesheet" href="poshytip-1.1/tip-yellow/tip-yellow.css" type="text/css" />

     <script type="text/javascript" src="js/jquery-1.6.js"></script>

     <script type="text/javascript" src="poshytip-1.1/jquery.poshytip.js"></script>

     <script type="text/javascript">

         $(function () {

             $(".poshytip").poshytip({

                 showTimeout: 300,　　//超时时间设为300时效果个人认为最佳，当然，可根据个人喜好设定

                    bgImageFrameSize: 20,

                 allowTipHover: false,

                 fade: false,

                 slide: false

             });

         });

     </script>

 </head>

说明一下：那个css文件就是poshytip的显示效果，有几个的，可以在刚才下载的包那里找，引入不同的css可以改变其显示效果，这里我就不墨迹了。还有，poshytip是基于jquery的，jquery.js也是必须的。而$(".poshytip")则代表需要调用这个效果的那些class，记得要带title，只要有了title属性，那么这个poshytip会自动调用。

好了，暂时就这么多了，enjoy it！

基于Jquery的文本提示控件 poshytip的更多相关文章

  1. 福利到~分享一个基于jquery的智能提示控件intellSeach.js

    一.需求 我们经常会遇到[站内搜索]的需求,为了提高用户体验,我们希望能做到像百度那样的即时智能提示.例如:某公司人事管理系统,想搜索李XX,只要输入“李”,系统自然会提示一些姓李的员工,这样方便用户 ...

  2. 一个基于jquery的智能提示控件intellSeach.js

    一.需求 我们经常会遇到[站内搜索]的需求,为了提高用户体验,我们希望能做到像百度那样的即时智能提示.例如:某公司人事管理系统,想搜索李XX,只要输入“李”,系统自然会提示一些姓李的员工,这样方便用户 ...

  3. jquery的智能提示控件

    福利到~分享一个基于jquery的智能提示控件intellSeach.js   一.需求 我们经常会遇到[站内搜索]的需求,为了提高用户体验,我们希望能做到像百度那样的即时智能提示.例如:某公司人事管 ...

  4. 打造基于jQuery的日期选择控件

    终于把jQuery拼写正确了哈,哈哈javascript也是区分大小写的,所以确实不能写错,今天我来和大家分享的是日期选择控件的实现,功能也许不够强大,但是能够满足需求. 我之前也写过(正确的说是改过 ...

  5. 基于JQuery EasyUI的WebMVC控件封装(含源码)

    JQuery EasyUI类库,大家不会陌生,出来已经有很多年了.个人感觉还是很好用的,作者更新频率也很快,bug也及时修复. 最近在整理以前的代码,找到了这个组件,它是将EasyUI组件封装成MVC ...

  6. jquery messagetip信息语提示控件

    编写原因: 作为提示框,jquery有个messagebox的控件,也就是弹出的提示框.但这个控件如果不是用在需要确认的时候,单单警告提示.消息提示.失败提示时,用户还需要去点下确认,有时这操作还是挺 ...

  7. 气泡形提示控件grumble.js

    grumble.js 是一个很特别的气泡形状提示控件,最开始是为 Huddle.com 网站开发的, 它没有通常的north/east/south/west的定位限制. 任何一个grumble都可以放 ...

  8. [转] 基于C#的波形显示控件的实现

    转自 基于C#的波形显示控件的实现[附完整源码下载] 编者记: 09年暑假正好在学院实验室呆了一段时间,做了个完整的上位机软件(具体实现:根据下位机的指令,实现通过串口来操纵下位机进行实验,并将采集的 ...

  9. 基于C#的波形显示控件的实现[转]

    编者记: 09年暑假正好在学院实验室呆了一段时间,做了个完整的上位机软件(具体实现:根据下位机的指令,实现通过串口来操纵下位机进行实验,并将采集的数据进行处理和保存,并以图形的方式显示),整个项目边学 ...

随机推荐

  1. Cannot resolve class or package 'springframework' less... (Ctrl+F1) Inspection info:Spring XML mode

    其实这个问题是由于MySQL 这个jar 包依赖类型默认是runtime ,也就是说只有运行时生效,所以虽然这里报错,但是不影响你代码运行. 解决方案: 将runtime 修改为Compile 即可 ...

  2. （转）python set 用法

    转载自:http://hi.baidu.com/����_xu/blog/item/5b9650c513bd3f049d163d8b .html python的set和其他语言类似, 是一个 基本功能 ...

  3. Amaze UI 框架

    Amaze UI 框架:官方网址 http://amazeui.org/ 演示地址 http://t.amazeui.org/kitchen-sink/#/ 该UI框架提供了 桌面系统WEB框架 和 ...

  4. Python：内置函数makestrans()、translate()

    转于:https://blog.csdn.net/u014351782/article/details/46740297 博主:夜-feng 一.makestrans() 格式: str.maketr ...

  5. fiddler 的AutoRespoder的使用（手动添加测试桩）

    ---恢复内容开始--- 1.首先我们抓取一个百度的请求,由于百度请求是https协议,需要手动添加证书(这个不写了,大佬们自己手动找下资料) 2.fiddler抓取的百度请求,其他的无关信息删除,便 ...

  6. java对象在内存中的结构（HotSpot虚拟机）

    一.对象的内存布局 HotSpot虚拟机中,对象在内存中存储的布局可以分为三块区域:对象头(Header).实例数据(Instance Data)和对齐填充(Padding). 从上面的这张图里面可以 ...

  7. js强加方法

    (function () { Array.prototype.removeItem=function (item) { var index=this.indexOf(item); if(index!= ...

  8. 从生成文件对比两种创建虚拟机的方式：boot from image和boot from bootable-volume

    1. 创建bootable-volume(参考:http://docs.openstack.org/grizzly/openstack-compute/admin/content/instance-c ...

  9. Python错误处理和调试

    错误处理(try...except...finally...) try: print('try...') r = 10 / 0 print('result:', r) except ZeroDivis ...

  10. macos下清除dnscache

    sudo killall -HUP mDNSResponder 参见链接