jquery实现动态增长进度条，移动端和PC端皆可实现

最新推荐文章于 2022-04-27 16:29:16 发布

开局一个bug

最新推荐文章于 2022-04-27 16:29:16 发布

阅读量594

点赞数

分类专栏： JS&Jquery 文章标签： js

本文链接：https://blog.csdn.net/weixin_42322532/article/details/100040145

版权

JS&Jquery 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

<<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="equser.aspx.cs" Inherits="Remote_UI.equser" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>JQuery 动态实现进度条</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no" />
    <script src="jq/jquery-3.2.1.min.js" type="text/javascript"></script>--%>
    <style type="text/css">
        body
        {
            margin: 0;
            padding: 0;
        }
        .main
        {
            width: 100%;
            margin: 0 auto;
        }
        .pro
        {
            width: 90%;
            margin: 10px 5%;
            height: 20px;
            background: #ccc;
            border-radius: 10px;
            overflow: hidden;
        }
        .pro_bg
        {
            background: red;
            height: 20px;
            width: 0;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <div class="main">
            <div class="pro">
                <div class="pro_bg">
                </div>
            </div>
        </div>
        <script type="text/javascript">
            $(function () {
                var ss = 1300;
                var num = 1;
                for (var i = 0; i < ss; i++) {
                    num++;
                }
                $(".pro_bg").animate({
                    width: num//加载百分比
                }, 10000);//进度条加载时长
            });
        </script>
    </div>
    </form>
</body>
</html>

开局一个bug

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
jquery实现动态增长进度条，移动端和PC端皆可实现

<<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="equser.aspx.cs" Inherits="Remote_UI.equser" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org...
复制链接

扫一扫

专栏目录