<style type="text/css"><!--
.LoadBarDiv {
BORDER-RIGHT: #777 1px dotted; BORDER-TOP: #777 1px dotted; DISPLAY: block; FONT-WEIGHT: normal; FONT-SIZE: 12px;
FILTER: Alpha(Opacity=80, FinishOpacity=10, Style=1, StartX=1, StartY=1, FinishX=1, FinishY=100); ; LEFT: expression
((this.parentElement.offsetWidth-this.offsetWidth)/2); VERTICAL-ALIGN: middle; BORDER-LEFT: #777 1px dotted; WIDTH: 250px;
WORD-BREAK: break-all; BORDER-BOTTOM: #777 1px dotted; FONT-FAMILY: "??", "Arial", "Helvetica", "sans-serif"; POSITION:
absolute; HEIGHT: 78px; BACKGROUND-COLOR: #f1f1f1
}
--></style>
<script language="JavaScript">
//¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤欢迎下载研究^谢谢¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤
// 恭喜你找到地址 想必很稀饭这个效果吧 ^^我可是做了很久的哦 ~ 嗯!眼光8错的说~~
// 把此函数直接引用在网页中就可以了 记得前面要加载它的css样式哦 不懂的可以问我的说~~
// == Page LoadBar ==
//:: Version.0.4
//:: Powered by Snow :: @ 2006.4.4
//:: QQ:49054026 ::
//:: Mail:snow@xunuo.com ::
//¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤
//+(长宽兼容性函数)+-------------------------------------------||
function scrollTop() //浏览器滚动条位置
{
var scrollTop;
if (document.documentElement && document.documentElement.scrollTop){
scrollTop = document.documentElement.scrollTop;
}else if (document.body){
scrollTop = document.body.scrollTop;
}else if (window.pageYOffset){
scrollTop = window.pageYOffset;
}
return scrollTop;
}
//浏览器窗口参数定义及获取函数，兼容IE6＆MF by nokersang ＊
function scrollX(){
if(document.documentElement.clientWidth<document.body.clientWidth&&document.documentElement.clientWidth){
theX = 'document.documentElement.clientWidth';
}else{
theX = 'document.body.clientWidth';
}
if(document.documentElement.clientHeight<=document.body.clientHeight&&document.documentElement.clientHeight){
theY = 'document.documentElement.clientHeight';
}else{
theY = 'document.body.clientHeight';
}
}
//scrollX();
//-------------------------------------------------------||
//+(配置函数)+-------------------------------------------||
function LoadBar_setvalue(){
LoadBar_Div = document.getElementById('LoadBar');
LoadBar_Msg = document.getElementById("LoadBar_Message");
LoadBar_Top = 250;
LoadBar_Div.style.top = LoadBar_Div.offsetTop + LoadBar_Top;
LoadBar_Div.filters.alpha.opacity = 50;
LoadBar_Delta = 0.05;
LoadBar_breathstep = 1;
LoadBar_hide_down_y_increase = 50;
LoadBar_Hide_downDelta = 0.06;
LoadBar_Hide_upDelta = 0.03;
LoadBar_hide_startalpha = 70;
}
//-------------------------------------------------------||
//+(放置LoadBar)+---------------------------------------||
function LoadBar_writebar(){
document.writeln("<div>");
document.writeln("<div id=\"LoadBar\" class=\"LoadBarDiv\">");
document.writeln("<div id=\"LoadBar_Message\" align=\"center\">");
document.writeln("<br>测试LoadBar<br \/>中间LoadBar_Div <br \/> Made by Snow <br \/> www.xunuo.com <br \/>");
document.writeln(" <font id=dot color=blue><\/font>");
document.writeln("<\/div>");
document.writeln("<\/div>");
document.writeln("<\/div>");
}
//-------------------------------------------------------||
//+(跟随滚动条滚动)+-------------------------------------||
function LoadBar_move()
{
if (LoadBar_Div.offsetTop != (scrollTop() + LoadBar_Top)) {
var dy = (scrollTop() + LoadBar_Top - LoadBar_Div.offsetTop) * LoadBar_Delta;
dy = (dy > 0 ? 1 : - 1) * Math.ceil(Math.abs(dy));
LoadBar_Div.style.top = LoadBar_Div.offsetTop + dy;
}
/* 注意 ..可能还没有偏移完就停止偏移了...因为LoadBar_SetIV函数clearInterval了LoadBar_move
if(LoadBar_Div.offsetLeft!=Math.round((eval(theX)-752)*0.25-50)){
var dx=((eval(theX)-752)*0.25-100-LoadBar_Div.offsetLeft) * LoadBar_Delta;
dx=(dx>0?1:-1)*Math.ceil(Math.abs(dx));
LoadBar_Div.style.left=LoadBar_Div.offsetLeft+dx+"px";
}
*/
}
//-------------------------------------------------------||
//+(LoadBar的渐显函数)+----------------------------------||
var LoadBar_breath_b = 0,LoadBar_breath_c = true;
function LoadBar_breath()
{
var n = LoadBar_breathstep,b = LoadBar_breath_b,c = LoadBar_breath_c;
if(b>=90) {c = false;}
if(c == false) {b-=n;}
if(b<=10) {c = true;}
if(c == true) {b+=n;}
LoadBar_Div.filters.alpha.opacity=b;
LoadBar_breath_b = b;
LoadBar_breath_c = c;
}
//-------------------------------------------------------||
//+(LoadBar的闪人函数)+----------------------------------||
var hide_upturn=false;
var hide_upturnnow = false;
function LoadBar_Hide()
{
clearInterval(IV_LoadBar_move);
clearInterval(IV_LoadBar_breath);
LoadBar_Msg.innerHTML="<br><font color=red>载入完毕</font><br><font color=blue>测试中..^_^<br>www.xunuo.com
</font>";
if(hide_upturn == false)
{
LoadBar_Div.filters.alpha.opacity = LoadBar_hide_startalpha;
var dy = (scrollTop() + LoadBar_Top + LoadBar_hide_down_y_increase - LoadBar_Div.offsetTop) * LoadBar_Hide_downDelta;
dy = (dy > 0 ? 1 : - 1) * Math.ceil(Math.abs(dy));
LoadBar_Div.style.top = LoadBar_Div.offsetTop + dy;
if(dy <= 0)
{
hide_upturn = true;
}
}
if(hide_upturn == true)
{
//意犹未尽 ~~ 还要移动一下先 到屏幕最中央再给你看 //上面的因为开始执行国move函数 所以有最新滚动条坐标
if (LoadBar_Div.offsetTop != (scrollTop() + LoadBar_Top) && hide_upturnnow != true) {
var dy = (scrollTop() + LoadBar_Top - LoadBar_Div.offsetTop) * LoadBar_Delta;
dy = (dy > 0 ? 1 : - 1) * Math.ceil(Math.abs(dy));
LoadBar_Div.style.top = LoadBar_Div.offsetTop + dy;
if(LoadBar_Div.offsetTop == (scrollTop() + LoadBar_Top)){hide_upturnnow = true;}
}else{
var dy = (scrollTop() - LoadBar_Div.offsetTop) * LoadBar_Hide_upDelta;
dy = Math.ceil(Math.abs(dy));
LoadBar_Div.style.top = LoadBar_Div.offsetTop - dy;
LoadBar_Div.filters.alpha.opacity = LoadBar_Div.filters.alpha.opacity-2;
if(LoadBar_Div.filters.alpha.opacity <= 0)
{
clearInterval(IV_LoadBar_Hide);
LoadBar_Div.style.display = "none";
}
}
}
}
//-------------------------------------------------------||
//+(放置Interval)+---------------------------------------||
function LoadBar_SetIV(start){
if(start == "before onload"){
IV_LoadBar_move = setInterval("LoadBar_move()",20);
IV_LoadBar_breath = setInterval("LoadBar_breath()",20);
}
else if (start == "after onload")
{
clearInterval(IV_LoadBar_move);
clearInterval(IV_LoadBar_breath);
IV_LoadBar_Hide = setInterval("LoadBar_Hide()",15);
}
}
//-------------------------------------------------------||
//+(出来吧~^^)+------------------------------------------||
function LoadBar_Start(){
LoadBar_writebar();
LoadBar_setvalue();
LoadBar_SetIV("before onload");
}
//-------------------------------------------------------||
//+(该走了~^^)+------------------------------------------||
function LoadBar_End(){
LoadBar_SetIV("after onload");
}
//-------------------------------------------------------||
//+(初始化 ~^^)+------------------------------------------||
LoadBar_Start();//Start~~~
//匿名函数 解决onload只能加函数名的问题
window.attachEvent('onload',LoadBar_End);
//-------------------------------------------------------||
//¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤
//请保留版权 这样我会很happy的 ^^ 3Q!~!^^ 留个我的站点地址备份吧~~常来哦~~
//{ :: + 许诺 | SnoW + ::}
//http://www.xunuo.com
//:: 找我玩魔兽? ::
//:: QQ:49054026 ::
//¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤¤
</script>
<body>
看看效果吧
</body></html>
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]
