zoukankan      html  css  js  c++  java
  • EasyUI Tooltip 提示框

    通过 $.fn.tooltip.defaults 重写默认的 defaults。

    当用户移动鼠标指针在某个元素上时,出现提示信息窗口用来显示额外信息。提示内容可以包含任何来自页面的或者通过 ajax 生成的 html 元素。

    用法

    创建提示框(Tooltip)

    1、从标记创建提示框(Tooltip),添加 'easyui-tooltip' class 到元素,不需要任何的 javascript 代码。

    <a href="#" title="This is the tooltip message." class="easyui-tooltip">Hover me</a>

    2、使用 javascript 创建提示框(Tooltip)。

    <a id="dd" href="javascript:void(0)">Click here</a>
    $('#dd').tooltip({
        position: 'right',
        content: '<span style="color:#fff">This is the tooltip message.</span>',
        onShow: function(){
            $(this).tooltip('tip').css({
                backgroundColor: '#666',
                borderColor: '#666'
            });
        }
    });

    属性

    名称类型描述默认值
    position string 提示框(tooltip)位置。可能的值:'left'、'right'、'top'、'bottom'。 bottom
    content string 提示框(tooltip)内容。 null
    trackMouse boolean 如果设置为 true,提示框(tooltip)会随着鼠标移动。 false
    deltaX number 提示框(tooltip)位置的水平距离。 0
    deltaY number 提示框(tooltip)位置的垂直距离。 0
    showEvent string 引发提示框(tooltip)出现的事件。 mouseenter
    hideEvent string 引发提示框(tooltip)消失的事件。 mouseleave
    showDelay number 显示提示框(tooltip)的时间延迟。 200
    hideDelay number 隐藏提示框(tooltip)的时间延迟。 100

    事件

    名称参数描述
    onShow e 当显示提示框(tooltip)时触发。
    onHide e 当隐藏提示框(tooltip)时触发。
    onUpdate content 当提示框(tooltip)内容更新时触发。
    onPosition left,top 当提示框(tooltip)位置改变时触发。
    onDestroy none 当提示框(tooltip)销毁时触发。

    方法

    名称参数描述
    options none 返回选项(options)属性(property)。
    tip none 返回提示(tip)对象。
    arrow none 返回箭头(arrow)对象。
    show e 显示提示框(tooltip)。
    hide e 隐藏提示框(tooltip)。
    update content 更新提示框(tooltip)内容。
    reposition none 重置提示框(tooltip)位置。
    destroy none 销毁提示框(tooltip)。
  • 相关阅读:
    python全栈开发 * 继承性 层叠性 盒模型 标准文档流 * 180809
    python全栈开发 * css 选择器 浮动 * 180808
    python全栈开发 * 表格标签 表单标签 css 引入方式 * 180807
    python全栈开发 * 线程队列 线程池 协程 * 180731
    saltstack的jinjia模板
    saltstack cmd状态模块和条件判断
    saltstack 配置管理之状态间关系
    saltstack lamp自动化案例实战
    saltstack 配置管理之状态模块
    saltstack 远程执行之返回写入到mysql
  • 原文地址:https://www.cnblogs.com/jiangxiaobo/p/7115400.html
Copyright © 2011-2022 走看看