nicescroll.js 搭配 bootstrap modal

分享至
nicescroll.js 搭配 bootstrap modal 會發生跑位的問題,解決方案:

$('.page1_btn2').click(function(){
        $('#info').modal('show');
        $(".modal-body").getNiceScroll().remove();//niceScroll必須先移除否則第二次會跑位

        /*判斷瀏覽器做動作*/
        var explorer = window.navigator.userAgent ;
        if (explorer.indexOf("MSIE") >= 0) {//ie10及以下

        }else if (explorer.indexOf("Firefox") >= 0){//Firefox

        }else if (explorer.indexOf("Chrome") >= 0){//Chrome
          
        }else if (explorer.indexOf("Opera") >= 0){//Opera

        }else if (explorer.indexOf("Safari") >= 0){//Safari
            setTimeout(function(){//niceScroll必須延遲,否則會跑位
                $(".modal-body").niceScroll({
                    touchbehavior:true,  //是否是触摸式滚动效果
                    cursorcolor: "#f3dba9", // 改变滚动条颜色,使用16进制颜色值
                    cursorwidth: "12px", // 滚动条的宽度,单位:便素
                    cursorborder: "1px solid rgb(236, 206, 144)", // CSS方式定义滚动条边框
                    autohidemode: "false",
                    background: "rgba(243,219,170,.5)", // 轨道的背景颜色
                    cursorborderradius: "5px", // 滚动条圆角(像素)
                });
            }, 500);
        }else if (explorer.indexOf("Trident/7.0") >= 0){//IE11

        }
    });

發表迴響