zoukankan      html  css  js  c++  java
  • tooltip

    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>
  • 相关阅读:
    GDB调试共享库的问题
    Android 2.3 StageFright如何选定OMX组件的?
    Perforce client p4常见用法
    pthread_cond_signal只能唤醒已经处于pthread_cond_wait的线程
    正则表达式验证数据例子
    美国经济数据公布时间
    .net去除html标签代码
    js Array 方法|js Array 方法使用
    在分析向此请求提供服务所需资源时出错。请检查下列特定分析错误详细信息并适当地修改源文件
    日期格式正则表达式
  • 原文地址:https://www.cnblogs.com/m01qiuping/p/6486383.html
Copyright © 2011-2022 走看看