本文目录一览:
- 1、页面重新加载js无限loading
- 2、有没有图片预加载的JS,我想要全部图片都加载转圈那个
- 3、js页面加载
- 4、求JS加载页跳转代码
- 5、怎么让页面加载完了,再执行js onload好像是js一起执行了 意思是页面加载完了,不转圈了,再执行js,求助
页面重新加载js无限loading
把top勾选去掉。
把top勾选去掉,页面就不会一直loading,可以用JS代码再巩固一下。
有没有图片预加载的JS,我想要全部图片都加载转圈那个
图片不的SRC地址不填真实地址,填loading图片(就是转圈的图片)地址,把真实的图片地址放到图片的title或者alt或者其它自定义属性上,然后在页面的onload 事件中(js),用是js遍历所有图片,然后预加载图片地址,加载完成后,把真实地址从title或者alt或者其它自定义属性上赋到src上即可,明天白天给你示例,留邮箱我
js页面加载
这个很简单,你PHP程序运行结束后可以echo出一段脚本比如:
echo "script language='javascript'fadeOut()/script";
然后html js脚本可以这么写:
div id="loading"
程序加载中,请稍等.....
(里面可以放你要的等待转圈的图片或者将其设置为背景图)
/div
script language='javascript'
function fadeOut(){
document.getElementById("loading").style.display="none";
}
/script
求JS加载页跳转代码
我刚好写了这么一个js效果。
css部分:
.cdiv1 {
position:absolute;
left:0px;
top:0px;
z-index:15000;
overflow:hidden;
z-index: 9990;
background:rgba(000, 000, 000, 0.3);
}
.cdiv2 {
height:60px;
width:150px;
/*border:1px solid blue;*/
position:fixed;
top:45%;
left:50%;
z-index: 9999;
margin-left:-75px;
-webkit-border-radius:10px;
text-align:center;
line-height:60px;
font-size:15px;
font-family:微软雅黑;
}
.cdiv2 div {
clear:none;
height:15px;
}
.show_div{
display:block;
width:100%;
min-height:50px;
height:auto;
background:rgba(255, 255, 255, 1);
line-height:50px;
text-align:center;
border-radius: 5px;
border:1px solid #ccc;
position:absolute;
z-index: 1800;
}
js部分:
var _cdiv = "",ktime;
function creatDiv() {
var _height = $(document.body).height();
var _width = $(document.body).width();
_cdiv += "div class='cdiv1'";
_cdiv += "/div";
_cdiv += "div class='cdiv2'";
_cdiv += "div id='showimgs'img src='../App_Themes/images/wait.gif' width='45px;' height='45px;' //div";
//_cdiv += "div加载中.../div";
_cdiv += "/div";
$(document.body).append(_cdiv);
$(".cdiv1").css("height", _height + "px").css("width", _width + "px");
}
function showDiv() {
if ($(".cdiv1").attr("class") != undefined) {
$("#showimgs").html("img src='../App_Themes/images/wait.gif' width='45px;' height='45px;' /");
$("#showimgs").removeClass("show_div");
$(".cdiv1").fadeIn(50);
$(".cdiv2").fadeIn(5);
} else {
creatDiv();
}
}
function appendText(){
if ($(".cdiv1")) {
$("#showimgs").html("网络异常,请检查网络");
$("#showimgs").addClass("show_div");
setTimeout(function(){hideDiv();},2000);
}
}
function hideDiv() {
window.clearInterval(ktime);
$(".cdiv1").hide();
$(".cdiv2").hide();
}
function startDiv(){
ktime= setTimeout(function () { appendText(); }, 15 * 1000);
showDiv();
}
调用方法:
startDiv();
加载完成后停止调用:
hideDiv();
效果图:
我这个是app端的。刚刚测试了下,一样适用于pc端。
代码说明:
1、这个加载转圈的图片你可以替换成文字“加载中...”,不能和图片同时存在(因为感觉比较丑)!
2、单出现网络问题时,会自动显示"网络异常,请检查网络",而这个显示不是检测请求的时间的。是设置最长时间的。如果再最长时间内,无法完成请求。就会显示出这个。这个显示出来2秒左右会自动消失。时间设置位置startDiv方法(转圈图片显示最长时间)。
3、加载转圈开始后,一定要在加载结束后调用停止的方法,否则就算请求完成了,依然会显示"网络异常,请检查网络"
比如(1个请求方法):
function state(){
//开始请求数据
//调用加载转圈效果
startDiv();
//开始请求数据
$.get("",{},function(){
//数据请求完成后调用停止加载效果(或者在请求完成后,并且做好相应处理后调用)
hideDiv();
});
}
如果有超过2个的方法的话方案一:
//定义一个变量,用于计算方法请求完成的个数
int index=0;
//请求方法1
function state1(){
//方法请求完成后,变量+=1
index+=1;
if(index==2){
//调用停止效果
hideDiv();
}
}
//请求方法2
function state2(){
//方法请求完成后,变量+=1
index+=1;
if(index==2){
//调用停止效果
hideDiv();
}
}
//使用一个方法,在这个方法里面调用其他的方法,并且调用加载效果
function fun(){
//调用加载转圈效果
startDiv();
//调用方法1
state1();
//调用方法2
state2();
}
方案二:
//使用jq的延迟调用方法:jQuery.when。或者使用jq插件deferred(deferred.then),
deferred.then(state1).then(state2);//最后调用的是state2方法,那就在state2方法里面停止效果
怎么让页面加载完了,再执行js onload好像是js一起执行了 意思是页面加载完了,不转圈了,再执行js,求助
script
!--
document.onreadystatechange = subSomething;//当页面加载状态改变的时候执行这个方法.
function subSomething()
{
if(document.readyState == "complete"window.parent.frames["框架名"].document.readyState == "complete") //当页面加载状态为完全结束时进入
myform.submit(); //这是你的操作
}
//--
/script
--------------
那就再加个IF条件呗:
window.parent.frames["mainFrame"].document.readyState == "complete"
上面代码已修改.
--------------
没有name就加个name呗.而且就算没有name也照样可以那么写啊.没有影响的.
或者你也可以这么写:
window.parent.frames.框架名.document.....
--------------
P了..加的是if条件.你循环顶什么用.照你这么循环.只要第一个frame加载完就直接执行了.哪儿还能循环到下一个frame.
老老实实把想判断的frame加到if里吧.