• 基于Jquery的文本提示控件 poshytip


    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!

  • 相关阅读:
    http headers总结
    golang跨域配置
    Kafka中topic的Partition,Kafka为什么这么快,Consumer的负载均衡及consumerGroup的概念
    kafka partition(分区)与 group
    RocketMQ从部署到应用(Golang)
    Codeforces Round #706 (Div. 2)
    关于平衡树
    具体数学 第三章 整值函数
    FFT&NTT&多项式全家桶
    省选测试15
  • 原文地址:https://www.cnblogs.com/ConfidentLiu/p/7205746.html
Copyright © 2020-2023  润新知