Bootstrap popover 實(shí)現(xiàn)鼠標(biāo)移入移除顯示隱藏功能方法
該段js代碼可實(shí)現(xiàn) popover 下鼠標(biāo)移入移除時(shí)顯示、隱藏 popover 提示信息功能
var strContent = '<div class="media"><div class="position-left media-left"><img class="img-circle" src="/assets/images/avatar.jpg">'+
'</div>'+
'<div class="media-body">'+
'<h4 class="media-title">小標(biāo)題</h4>'+
'<p><strong>張三</strong> <span class="label label-primary">管理員</span></p>'+
'</div>'+
'</div>';
$( 'li#user_avatar' ).popover({
trigger:'manual',
placement:'bottom',
html:true,
container:'#bs-example-navbar-collapse-1',
content:strContent,
}).on( 'mouseenter', function(){
var _this = this;
$(this).popover( 'show' );
$(this).siblings( '.popover' ).on( 'mouseleave' , function () {
$(_this).popover( 'hide' );
});
}).on( 'mouseleave', function(){
var _this = this;
setTimeout(function () {
if (!$( '.popover:hover' ).length) {
$(_this).popover( 'hide' )
}
}, 100);
});
以上這篇Bootstrap popover 實(shí)現(xiàn)鼠標(biāo)移入移除顯示隱藏功能方法就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
JavaScript實(shí)現(xiàn)給對(duì)象添加一個(gè)只讀屬性
這篇文章主要為大家介紹了JavaScript如何給對(duì)象加一個(gè)只讀屬性,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-06-06
JavaScript聲明函數(shù)的5種方法小結(jié)
本文主要介紹了JavaScript聲明函數(shù)的5種方法小結(jié),文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2023-02-02
javascript中call,apply,bind函數(shù)用法示例
這篇文章主要介紹了javascript中call,apply,bind函數(shù)用法,結(jié)合實(shí)例形式分析了call,apply,bind函數(shù)的功能、使用方法與相關(guān)注意事項(xiàng),需要的朋友可以參考下2016-12-12
js實(shí)現(xiàn)將選中內(nèi)容分享到新浪或騰訊微博
這篇文章主要介紹了js實(shí)現(xiàn)將選中內(nèi)容分享到新浪或騰訊微博,需要的朋友可以參考下2015-12-12
filters.revealTrans.Transition使用方法小結(jié)
有看到幻燈片調(diào)用會(huì)用到divid.filters.revealTrans.Transition=Math.floor(Math.random()*23)和divid.filters.revealTrans.apply(),那么這兩個(gè)都是什么意思呢?2010-08-08
Javascript仿PHP $_GET獲取URL中的參數(shù)
這篇文章主要介紹了Javascript仿PHP $_GET獲取URL中的參數(shù)代碼實(shí)例,需要的朋友可以參考下2014-05-05

