Heim > Web-Frontend > js-Tutorial > JS 进度条效果实现代码整理_javascript技巧

JS 进度条效果实现代码整理_javascript技巧

WBOY
Freigeben: 2016-05-16 18:06:28
Original
1144 Leute haben es durchsucht

第一种方法:
Loading.js

复制代码 代码如下:

//频率
var frequency = 50;
//步长
var step = 3;
//背景颜色
var loadingBgcolor = "#ffffff";
//宽度
var loadingWidth = 354;

/*
*参数说明:
*content:显示内容,可以为空;
*imageURL:将引用JS文件的路径设置即可;
*left:进度条显示位置left
*top:进度条显示位置top
*/
function Loading(content, imageURL, left, top)
{
imageURL = imageURL + "Loading.jpg";

LoadTable(content, imageURL, left, top);
showimage.style.display="";
window.setInterval("RefAct();", frequency);
}

function RefAct()
{
imgAct.width += step;
if(imgAct.width > loadingWidth-4)
{
imgAct.width = 0;
}
}

function LoadTable(content, imageURL, left, top)
{
var strLoading;
strLoading = "";
strLoading += "
";
strLoading += "";
if(content != "")
{
strLoading += "";
strLoading += "";
strLoading += "";
strLoading += "";
}
strLoading += "";
strLoading += "";
strLoading += "
";
strLoading += "" + content + "";
strLoading += "
";
strLoading += "\"\"";
strLoading += "
";
strLoading += "
";

document.getElementById("loading_div").innerHTML = strLoading;
}

使用页:
复制代码 代码如下:




Untitled Document






Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage