鼠标悬停设置layui tips提示框
官方介绍:吸附层,灵活判断出现的位置,默认在元素的右侧弹出。
layer.tips(content, follow, options)
layer.tips(msg, '#id',{tips: 1})
必填参数 :
content: 生成的文本,可以是字符串或HTML代码
follow: 元素ID,若是元素本身可直接用this(绑定元素时)
options : tips的配置型,即位置[1上;2右;3下;4左, 字体颜色]
还有一些基础参数,我的另一篇文章中,是layer弹出层是基础参数
实例:
function showDiv(obj){
layer.tips("<span>车辆轨迹</span><span>关联人员</span>",
"#"+obj.id,
{tips:[2, '#663ff'], time:3000});
}
以上效果就是鼠标悬浮到a标签后,显示悬浮窗,3s后自动关闭。为啥要设置3秒自动关闭?因为这样可以让我们去点击a标签里的内容。由于会自动关闭,所以也不需要鼠标移除的事件。
需要注意的是,需要多个tips悬浮时,tipsMore(默认false)应该是flase的
鼠标悬停设置layui tips提示框的更多相关文章
- jQuery实现鼠标移上弹出提示框,移出消失
<TD>里有一行数据 "那片笑声让我想起......" 假设超出规定长度将用......代替, 而现在要通过鼠标移动到......上 显示全部内容,移出则消失.如下图 ...
- win10设置删除文件提示框
显示桌面,找到回收站 点击鼠标右键,点击“属性菜单” 勾选“显示删除对话框” 点击“应用”,点击“确定”. 测试一下吧,从电脑删除del删除一个文件.如下图所示,弹出了提示框.
- css制作tips提示框,气泡框,制作三角形
有时候我们的页面会需要这样的一些提示框或者叫气泡框,运用css,我们可以实现这样的效果. 为了实现上面的效果,我们首先要理解如何制作三角形. 当我们给一个DIV不同颜色的边框的时候,我们可以得到下面的 ...
- Echarts 地图(map)插件之 鼠标HOVER和tooltip自定义提示框
[自行修改 "引号"] 一.鼠标HOVER时的事件: 参照官方文档解释, 可以看出这款插件有丰富的鼠标事件可供选择: 调用鼠标HOVER事件的方法很简单,只需把以下代码放到char ...
- 设置InputBox等提示框的字体以及样式
InputBox等窗体的字体大小设置方法 Graphics.DefFontData.Height:=48; Graphics.DefFontData.Style:=[fsBold,fsItalic, ...
- echarts —— tooltip 鼠标悬浮显示提示框属性
最近一直在使用echarts,当然也被其中的各种属性整的头大,记录一下其中遇到的问题. tooltip:鼠标悬浮时显示的提示框. 今天想要记录的是[自定义提示框的内容],如下图,鼠标悬浮时提示框内显示 ...
- Echarts数据可视化tooltip提示框,开发全解+完美注释
全栈工程师开发手册 (作者:栾鹏) Echarts数据可视化开发代码注释全解 Echarts数据可视化开发参数配置全解 6大公共组件详解(点击进入): title详解. tooltip详解.toolb ...
- 【Unity笔记】提示框ToolTips大小自适应,及其闪烁的问题
需求:制作了一个提示框,当鼠标移入背包格子内,显示提示框,且提示框位置跟随鼠标移动.当鼠标移出背包格子,隐藏提示框. 制作提示框ToolTips 因为提示框的大小要求随着显示的文本内容长度而自动大小适 ...
- tooltip提示框组件
Tooltip 提示框组件 可独立于其他组件通过$.fn.tooltip.defaults重写默认的defaults.当用户移动鼠标指针在某个元素上时,出现提示信息窗口来显示额外信息.提示内容可以包含 ...
随机推荐
- 实验一 绘制任意斜率的直线段 | 使用VS2017工具
这世界上有很多坑,注定有些坑是要填的.下面我就用VS2017使用MFC对这个课堂实验进行填坑. 一.实验目的 (1)掌握任意斜率直线段的重点 Bresenham 扫描转换算法: (2)掌握 Cline ...
- 用es6实现一个promsie
Promise 使用方法:https://www.runoob.com/w3cnote/javascript-promise-object.html 直接上代码,相关的解释都在代码的注释里面,这里以m ...
- Vue开发工具
vue微信小程序:mpvue 极客开发工具:Dcloud,uni-app 一套代码多终端. 简书-推荐的Vue UI库 Vue UI: 功能介绍帖子之一 :帖子二 VSCode: 介绍帖子 Vue- ...
- 【网易微专业】图表绘制工具Matplotlib
01 与图片的交互方式设置 这一小节简要介绍一下Matplotlib的交互方式 import pandas as pd import numpy as np import matplotlib.pyp ...
- 日志备份shell脚本
脚本注释已经很清楚了,就不再啰嗦了. 算了,还是多说一句吧,脚本设计完成之后,就可以加入计划任务,让电脑帮你打工了. 注:关于计划任务crontab,我会专门写一篇笔记. 最最最后一句, find $ ...
- 【VS开发】recv函数函数返回值说明(特别有利于工程调试)
recv函数 int recv( SOCKET s, char FAR *buf, int len, int flags); 不论是客户还是服务器应用程序都用recv函数从TCP连接的另一端接收数据. ...
- 通过案例来剖析JQuery与原生JS
首先来个例子: 我们在登陆或者注册一些网站时,如果某一项点过了但没填,鼠标移走后是不是经常看到网站有相应的红色字体提示呢? 那下面我们就以这个为例来剖析下jQuery和原生JS的一些区别,来上代码: ...
- c++文件指针读写图片文件
#include "stdafx.h"#include <string>using namespace std;int _tmain(int argc, _TCHAR* ...
- DOS cscript
C:\>cscript /?Microsoft (R) Windows Script Host Version 5.812版权所有(C) Microsoft Corporation.保留所有权利 ...
- 【Redis】Redis持久化
Redis数据持久化 Redis的特性: 易扩展,大数据高性能,多样灵活的数据模型,受限内存 Redis默认端口: 6379 Redis数据持久化分为有两种: RDB: 每隔一段时间就把内存数据写入磁 ...