jquery + Bootstrap : data-toggle="popover"鼠标放上去显示悬浮层 Tips

简介: image.pngjquery鼠标放上去显示悬浮层 Tipshtmljs$(() => { var tip = $('#time_range_fa'); $(tip).
image.png

jquery鼠标放上去显示悬浮层 Tips

html

<div class="input-group-addon" style="border: 0;">
<a 
id="time_range_fa" 
href="#" 
class="fa fa-info-circle col-sm-1"                                      
style="color: #3c8dbc;font-size: 14px;" 
data-toggle="popover"
data-placement="bottom"                                      
data-trigger="hover">
</a>
</div>

js

$(() => {
    var tip = $('#time_range_fa');
    $(tip).popover({
        html: true,
        title: '默认查询时间:',
        delay: {show: 500, hide: 1000},
        content: function () {
            return '2017-12-01 至 2017-12-31';
        }
    });
})
相关文章
|
7月前
|
开发框架 前端开发 JavaScript
使用JavaScript、jQuery和Bootstrap构建待办事项应用
使用JavaScript、jQuery和Bootstrap构建待办事项应用
128 0
|
前端开发 程序员 Android开发
Bootstrap+jQuery实现卡片标签样式的分页
Bootstrap+jQuery实现卡片标签样式的分页
75 0
|
JavaScript 前端开发 开发者
|
7月前
|
Java 数据库 Maven
基于SSM框架疫情之下社区管理系统(spring+springmvc+mybatis+jsp+jquery+bootstrap)
基于SSM框架疫情之下社区管理系统(spring+springmvc+mybatis+jsp+jquery+bootstrap)
|
JavaScript
jquery鼠标悬停的时候图片改变
jquery鼠标悬停的时候图片改变
40 1
|
JavaScript 前端开发
jQuery鼠标悬停的时候图片替换
jQuery鼠标悬停的时候图片替换
52 0
|
JavaScript
jQuery鼠标离焦验证手机号码
jQuery鼠标离焦验证手机号码
44 0
|
JavaScript 前端开发 开发者
|
前端开发 JavaScript Java
Jquery+Ajax+Bootstrap Paginator实现分页的拼接
Jquery+Ajax+Bootstrap Paginator实现分页的拼接
62 0
|
JavaScript
判断鼠标从哪个方向进入--jQuery
判断鼠标从哪个方向进入--jQuery
42 0