0

このJqueryプログレスバー関数を見つけました。これを使用して、Webページの読み込み中にプログレスバーを表示したいと思います。私のページの読み込みが少し遅いので、ページの読み込みが停止していないことをユーザーに思い出させるのに役立ちます。以下はjavascriptとcssの部分です。では、html部分にそれを実装する方法は？HTML本文には何を含めるのですか？

<script type="text/javascript" src="js/jquery.progressbar.js"></script>
    <script type="text/javascript">
        var progress_key = '<?= $uuid ?>';

        $(document).ready(function() {
            $("#pb1").progressBar();
            $("#pb2").progressBar({ barImage:  
           'images/progressbg_yellow.gif'} );
            $("#pb3").progressBar({ barImage: 
           'images/progressbg_orange.gif', showText: false} );
            $("#pb4").progressBar(65, { showText: false, barImage: 
           'images/progressbg_red.gif'} );
            $(".pb5").progressBar({ max: '2000', textFormat: 
             'fraction', callback: function(data) { if (data.running_value == 
               data.value) { 
            alert("Callback example: Target reached!"); } }} );
            $("#uploadprogressbar").progressBar();
        });

</script>
<style type="text/css">
        table tr { vertical-align: top; }
        table td { padding: 3px; }
        div.contentblock { padding-bottom: 25px; }  
        #uploadprogressbar { display: none; }
</style>

ありがとう

4

1 に答える 1

1

必要な参照しているデモに基づいて

<span class="progressBar" id="pb1"></span>

ID pb1 .. pb4 のいずれか

http://jsfiddle.net/RUBSx/1/

于 2012-05-29T15:14:03.643 に答える