Home > Developer > Web Develop
jquery implements the script code that detects the browser and version:
In some specific scenarios, the application of progress bar effect, can improve the user-friendliness of the site, to enable users to master the progress, increase the patience of the progress, otherwise it may directly lead to the closure of the page, has never resulted in the loss of the site users, the following is the implementation of jquery with the progress of the code.
<!DOCTYPE HTML><HTML><Head><MetaCharSet= "Utf-8"><Metaname= "Author"content= "http://www.51texiao.cn/" /><title>Ant Tribe</title><Scriptsrc= "Http://libs.baidu.com/jquery/1.9.0/jquery.js"></Script><styletype= "Text/css">#progress{background: White;Height:20px;padding:2px;Border:1px solid Green;margin:2px;}#progress span{background:Green;Height:16px;text-align:Center;padding:1px;margin:1px;Display:Block;Color:Yellow;Font-weight:Bold;font-size:14px;width:0%;}</style><Scripttype= "Text/javascript"> varprogress_node_id= "Progress"; functionSetprogress (Progress) {if(Progress) {$ ("#" +progress_node_id+ "> Span"). CSS ("width", String (progress)+ "%"); $("#" +progress_node_id+ "> Span"). HTML (String (progress)+ "%"); } } varI= 0; functiondoprogress () {if(i> -) {alert ("Progress Bar finished!"); return; } if(i<= -) {setTimeout ("doprogress ()", -); Setprogress (i); I++; }} $ (document). Ready (function() {doprogress (); }); </Script></Head><Body><H1>jquery Implementation progress bar effect code</H1><P>The principle is to use Javascript to control the width of the SPAN CSS (and other styles) and refresh the view</P><DivID= "Progress"><span></span></Div></Body></HTML>
The above code realizes the commonly used progress bar effect, in the progress bar pushes the time to have the percentage marking, is very humanized.
The original address is: http://www.51texiao.cn/jqueryjiaocheng/2015/0504/681.html
jquery implements the script code to detect the browser and version
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
