简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Home > Web Front-end > JS Tutorial > body text

JS implements page jump effects with progress bar

高洛峰
Release： 2016-12-16 16:48:11
Original
2131 people have browsed it

当进度条到100%进打开指定的网站,通常用于一些404页面等等方面。

<html><head><script language="javascript">
  function setSB(v, el) {    var ie5 = (document.all  &&  document.getElementsByTagName);    if (ie5 || document.readyState == "complete")     {
      filterEl = el.children[0];
      valueEl = el.children[1];
      filterEl.style.width = v + "%";
      valueEl.innerText = v + "%";
    }
  }  function fakeProgress(v, el) {    if (v > 100)      location.href = "http://www.newxing.com/";    else     {
      setSB(v, el);      window.setTimeout("fakeProgress(" + (++v) + ", document.all[&#39;" + el.id + "&#39;])", 20);
    }
  }</SCRIPT></head><body onload="fakeProgress(0, sb)" topmargin=180 bgcolor=#CCCCCC><center><p align=center style="font-szie:9pt; line-height: 100%">正在进入新兴网络，请稍侯……</p><span id=sb style="width: 500px"><div style="filter: Alpha(Opacity=0, FinishOpacity=60, style=1, StartX=0, StartY=0, FinishX=100, FinishY=0); width: 0%; height: 12px; position: absolute; background: #9999ff"></div><div style="font-size: 12px; width: 100%; color: #ff3333; font-family: arial; text-align: center"></DIV></span>
 </center>
 </body></html>
Copy after login


更多JS 实现带进度条的页面跳转特效相关文章请关注PHP中文网！

Related labels：
JS进度条
source：php.cn
Previous article：js progress bar example code Next article：JS implements loading progress bar when loading page
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Latest Issues
Can a workerpool declared in multiple routes still maintain its cpu usage without caring about the threshold I'm hoping to find a node.js system with a workerpool to handle CPU intensive tasks, but I...
From 2024-04-06 19:54:23
0
1
444
The execution order of VueJS scheduling functions causes problems I'm trying to display a list of announcements (retrieved from API) on a page. I'm using a ...
From 2024-04-06 10:37:58
0
1
385
Vertically rotated table title, centered + bottom aligned, cross-browser I have a table with rotated headers that looks as expected in Chrome, but not in Firefox. ...
From 2024-04-04 16:45:25
0
1
330
When getting data from multiple tables, how to query based on entries in the table in SQL grouping I have two tables click 2.ride click table id | time ride table id | timestamp I want to g...
From 2024-04-04 08:58:17
0
1
319
Use methods from apply To find the maximum value of an array, a simple way is Math.max.apply(null,myArray) Howeve...
From 2024-04-03 21:41:46
0
2
278
Related Topics
More>
Popular Recommendations
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn：Public welfare online PHP training，Help PHP learners grow quickly！