欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

BootStrap模態(tài)框不垂直居中的解決方法

 更新時(shí)間：2017年10月19日 10:16:17   作者：夏爾_  
這篇文章主要為大家詳細(xì)介紹了BootStrap模態(tài)框不垂直居中的解決方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

本文實(shí)例為大家分享了BootStrap模態(tài)框不垂直居中的解決方法，供大家參考，具體內(nèi)容如下

解決問(wèn)題：BootStrap自帶的模態(tài)框不垂直居中

解決方案：調(diào)用BootStrap為我們提供的方法$('.modal').on('show.bs.modal', function(){});

在模態(tài)框顯示之前我們用JS修改他的Top值，

具體代碼如下：

/** 
 * 垂直居中模態(tài)框 
 **/ 
function centerModals() { 
  $('.modal').each(function(i) { 
    var $clone = $(this).clone().css('display', 'block').appendTo('body'); 
    var top = Math.round(($clone.height() - $clone.find('.modal-content').height()) / 2); 
    top = top > 50 ? top : 0; 
    $clone.remove(); 
    $(this).find('.modal-content').css("margin-top", top - 50); 
  }); 
} 
// 在模態(tài)框出現(xiàn)的時(shí)候調(diào)用垂直居中方法 
$('.modal').on('show.bs.modal', centerModals); 
// 在窗口大小改變的時(shí)候調(diào)用垂直居中方法 
$(window).on('resize', centerModals);

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

相關(guān)文章

  • Javascript中判斷對(duì)象是否為空

    Javascript中判斷對(duì)象是否為空

    這篇文章主要介紹了Javascript中判斷對(duì)象是否為空,本文利用Javascript 中的對(duì)象就是一個(gè)字典的特性,檢查對(duì)象中有沒(méi)有鍵值對(duì)實(shí)現(xiàn)判斷對(duì)象是否為空,需要的朋友可以參考下
    2015-06-06
  • BootStrapValidator校驗(yàn)方式

    BootStrapValidator校驗(yàn)方式

    做輸入校驗(yàn)的時(shí)候如果你前端框架用的是bootstrap的話(huà)，首推bootstrapValidator校驗(yàn)方式，下面通過(guò)本文給大家分享下校驗(yàn)流程，一起看看吧
    2016-12-12
  • JavaScript之AOP編程實(shí)例

    JavaScript之AOP編程實(shí)例

    這篇文章主要介紹了JavaScript的AOP編程,以實(shí)例形式分析了javascript面向切面編程的實(shí)現(xiàn)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
    2015-07-07
  • js實(shí)現(xiàn)字符全排列算法的簡(jiǎn)單方法

    js實(shí)現(xiàn)字符全排列算法的簡(jiǎn)單方法

    下面小編就為大家?guī)?lái)一篇js實(shí)現(xiàn)字符全排列算法的簡(jiǎn)單方法。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
    2017-05-05
  • 重寫(xiě)javascript中window.confirm的行為

    重寫(xiě)javascript中window.confirm的行為

    javascript中window.confirm這個(gè)方法很好用，可以彈出一個(gè)確認(rèn)對(duì)話(huà)框.但有一個(gè)問(wèn)題是，它默認(rèn)的情況下，將選中那個(gè)"確定"按鈕，當(dāng)用戶(hù)有意無(wú)意的在鍵盤(pán)回車(chē)，就是說(shuō)按下Enter鍵的時(shí)候，就會(huì)自動(dòng)返回true。在很多時(shí)候其實(shí)我們不希望這樣
    2012-10-10
  • Blob對(duì)象實(shí)現(xiàn)文件上傳下載示例詳解

    Blob對(duì)象實(shí)現(xiàn)文件上傳下載示例詳解

    這篇文章主要為大家介紹了Blob對(duì)象實(shí)現(xiàn)文件上傳下載示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪
    2023-01-01
  • javascript 保存文件到本地實(shí)現(xiàn)方法

    javascript 保存文件到本地實(shí)現(xiàn)方法

    本文將提供兩種方式保存圖片，大家可以根據(jù)喜歡自由選擇
    2012-11-11
  • 小程序如何實(shí)現(xiàn)中間帶加號(hào)的tabbar

    小程序如何實(shí)現(xiàn)中間帶加號(hào)的tabbar

    自定義tabBar可以讓開(kāi)發(fā)者更加靈活地設(shè)置tabBar樣式,以滿(mǎn)足更多個(gè)性化的場(chǎng)景,下面這篇文章主要給大家介紹了關(guān)于小程序如何實(shí)現(xiàn)中間帶加號(hào)tabbar的相關(guān)資料,需要的朋友可以參考下
    2022-04-04
  • 淺談FastClick 填坑及源碼解析

    淺談FastClick 填坑及源碼解析

    這篇文章主要介紹了淺談FastClick 填坑及源碼解析，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
    2018-03-03
  • JS關(guān)鍵字球狀旋轉(zhuǎn)效果的實(shí)例代碼

    JS關(guān)鍵字球狀旋轉(zhuǎn)效果的實(shí)例代碼

    這篇文章主要介紹了JS關(guān)鍵字球狀旋轉(zhuǎn)效果的實(shí)例代碼。需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助
    2013-11-11

最新評(píng)論