zoukankan      html  css  js  c++  java
  • tooltip(提示框)组件

    一、class加载方式

      <span id="pos" class="easyui-tooltip" title="这是提示内容">内容</span>

    二、js加载方式

       $("#pos").tooltip({

          //属性
        content:'<strong>这是内容提示框</strong>', //消息框内容,识别html标签,默认为 null,值为string
        position:'bottom', //消息框位置。left/right/top/bottom 默认 bottom,值为string
        trackMouse:true, // 允许提示框跟随鼠标移动, 默认为false,值为 boolean
        deltaX:100, //水平方向提示框的位置。默认为 0,值为 number
        deltaY:20, //垂直方向提示框的位置。默认为 0,值为 number
        showDelay:1000, //延时多少秒显示提示框。默认 200,值为 number
        hideDelay:1000, //延时多少秒隐藏提示框。默认 100,值为 number
        //showEvent:'click',//当激活事件的时候显示提示框,默认为 mouseenter,值为string
        //hideEvent:'dblclick',// 当激活事件的时候显示提示框,默认为 mouseleave ,值为string
      //事件
        onShow : function (e) {
        console.log($('#pos').tooltip('tip'));//返回 tip 元素对象,传参none
        console.log($('#pos').tooltip('arrow'));//返回箭头元素对象,传参none
        }, //在显示提示框的时候触发,传参为e
        onHide : function (e) {}, //在隐藏提示框的时候触发,传参为e
        onUpdate :function (content) {
        alert("内容改变为"+content)
        },//在提示框内容更新的时候触发,传参为content
        //onPosition:function (left,top) {
        //console.log('left:' + left + ',top:' + top);
        // },//在提示框位置改变的时候触发,传参 left、top
        onDestroy:function () {},// 在提示框被销毁的时候触发,传参none
        // onShow : function(e) {
        // $('.tooltip-right').css('left', 500);
        // },
        // onHide : function (e) {
        // $('#pos').tooltip('reposition');//重置工具栏位置
        // }
    });
      //方法
        $("#pos").click(function () {
        // $(this).tooltip("update","<strong>这是内容提示框</strong>");
        $(this).tooltip("destroy");
        });
        console.log($('#pos').tooltip('options'));//返回属性对象,传参none
        //$('#pos').tooltip('show');//显示提示框,传参为e
        //$('#pos').tooltip('hide');//隐藏提示框,传参为e
        //$('#box').tooltip('destroy');//销毁提示框,传参none
        //$('#box').tooltip('update', '更新提示内容');//更新content内容

  • 相关阅读:
    Service Location Protocol SLP
    [http 1.1] M-POST
    安装 wbemcli
    [http 1.1] M-POST w3
    [CODEVS 1288]埃及分数
    [NOIp 2013]货车运输
    [测试题]gentree
    [USACO 07NOV]Cow Relays
    [USACO 13DEC]Vacation Planning(gold)
    [CODEVS 2495]水叮当的舞步
  • 原文地址:https://www.cnblogs.com/Alaic2052243080/p/11440245.html
Copyright © 2011-2022 走看看