亚洲免费乱码视频,日韩 欧美 国产 动漫 一区,97在线观看免费视频播国产,中文字幕亚洲图片

      1. <legend id="ppnor"></legend>

      2. 
        
        <sup id="ppnor"><input id="ppnor"></input></sup>
        <s id="ppnor"></s>

        BootStrap初學(xué)者對彈出框和進度條的使用感覺

        字號:


            Bootstrap,來自 Twitter,是目前最受歡迎的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的,它簡潔靈活,使得 Web 開發(fā)更加快捷。
            bootstrap 框架提供的進度條,如菜鳥教程里面的這些代碼
            <div>
            <div role="progressbar" aria-valuenow="60"
            aria-valuemin="0" aria-valuemax="100">
            <span>40% 完成</span>
            </div>
            </div>
            讓我這種真正的菜鳥一開始不知道該如何....讓其變?yōu)檎嬲倪M度條。不過進過百度幾下別人的之后,只要這個是要添加jquery代碼配合之下才能實現(xiàn)滴。我度呀度,終于實現(xiàn)如下,略帶高興。
            <div id="myModal1" tabindex="-1" role="dialog"
            aria-labelledby="myModalLabel" aria-hidden="true" data-backdrop="static">
            <div>
            <div >
            <span>文件正在上傳請勿刷新頁面!</span><br />
            <div>
            <div>
            </div>
            </div>
            </div>
            </div>
            </div>
            上面這段是,用彈出框里面包含進度條。不然怎么實現(xiàn)一個開始讓其隱藏的呢?在用bootstrap 做進度條,或者固定的彈出框時,加上data-backdrop="static" 這句比較好,因為沒有這個修飾,你只要點擊下鼠標(biāo),彈出框就消失不見了。
            <scripts>
            var p = 101;
            var stop = 1;
            function run() {
            p += 4;
            $("div[class=bar]").css("width", p + "%");
            var timer = setTimeout("run()", 500);
            if (p >100&&stop<1) {
            p = 0;
            }
            }
            $('#BtnSubmit').click(function () {
            $('#myModal1').modal('show');
            p = 0;
            stop = 0;
            run();
            $('#UpLoad').submit();
            });
            </scripts>
            其實,bootstrap的進度條是通過css樣式進行展現(xiàn)的,所以只要不斷滴修改,style width的值,就可以顯示出來。當(dāng)然我這個循環(huán),重現(xiàn)刷新頁面才能重新隱藏掉進度條。若是,用post提交,然后根據(jù)返回值進行判斷,然后用$('#myModal1').modal('hide');將其隱藏,stop的值相應(yīng)滴就改為1,不然會在一直跑滴。