Using the progress bar


开发工具与关键技术:vs与jquery

作者:戴怡斌 

撰写时间:2019年5月26日

The progress bar is no stranger to everybody, played the game even more clear, on behalf of the meaning of it, load the scene of people playing the game, for people browsing the web is to wait, loading means.

The progress bar the use of a very wide range, but also a wide range of styles, can also be used in conjunction with other code.

The progress bar may also be used in many business scenarios, such as the progress of the task is completed, loading, etc., is a more intuitive expression elements.

Recommend the use of plug-ins, do not ask me why, to know, I layui progress bar inside the plug with a progress bar.

<link href="~/Hospital Outpatient/layui/css/layui.css" rel="stylesheet" />

Because the progress bar to load event, so would like to quote js, js is mainly because the progress bar is particularly dependent element components layui plug-in, as to why particularly dependent, will know later

<script src="~/Hospital Outpatient/layui/layui.js"></script>

Layui plug there are two styles is a lot of size, color, I like.

One is displayed as a percentage, the second is the score display, and the default percentage of the text is not displayed,
Here Insert Picture Description
a small number will progress bar at the top, large progress bar progress bar is inside the digital progress bar.

If you do not want these figures show, or unsightly looking at these numbers, you can also show them otherwise, in fact, do not display the default number or percentage,

If you want to open, you can set any value on the property lay-showPercent, just a word on it. But if you do not want to show, do not set the What no or false, delete the attribute.
Here Insert Picture Description
Like the figure, like the lay-showPercent directly delete it, it will not turn on the digital display.
Here Insert Picture Description
Js part is easy, correct to say that there is a very simple plug-in, can not believe, if you did not write the word element, then you js part on all fails, then the progress bar will not show (really special dependent).

The progress bar can be used with a lot of things, such as time selector.

After all you Qiaowan, checking again, run. Renderings
Here Insert Picture Description

Guess you like

Origin blog.csdn.net/weixin_44561520/article/details/90639070