jquery animate 마우스 올 려 놓 기 숨 김 효과 보이 기
3267 단어 animate디 스 플레이 올 리 기숨겨 진 곳 을 떠나다
@CHARSET "UTF-8";
* html .showbox,* html .overlay {
position: absolute;
top: expression(eval(document.documentElement.scrollTop) );
}
#AjaxLoading {
border: 1px solid #8CBEDA;
color: #37a;
font-size: 12px;
font-weight: bold;
}
#AjaxLoading div.loadingWord {
width: 180px;
height: 50px;
line-height: 50px;
border: 2px solid #D6E7F2;
background: #fff;
}
#AjaxLoading img {
margin: 10px 15px;
float: left;
display: inline;
}
.overlay {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 998;
width: 100%;
height: 100%;
_padding: 0 20px 0 0;
background: #f6f4f5;
display: none;
}
.showbox {
position: fixed;
top: 0;
left: 50%;
z-index: 9999;
opacity: 0;
filter: alpha(opacity = 0);
margin-left: -80px;
}
2.JS:
/**
*
*
* @author dendy
* @since 2013-7-19 10:13:05
*/
function getLoadingHtml(msg) {
if(!msg) msg = " ";
var html = "<div id='loadingDiv'>"
+ "<div style='height: 1325px; display: none; opacity: 0;' class='overlay'></div>"
+ "<div style='opacity: 0; margin-top: 250px;' id='AjaxLoading' class='showbox'>"
+ "<div class='loadingWord'>"
+ "<img src='" + Util.getContentPath() +"/images/ajax-loader.gif'>" + msg + " , ..."
+ "</div>"
+ "</div>"
+ "<div style='height: 1200px;'></div>"
+ "</div>";
return html;
}
function ajaxLoadingInit(msg) {
var loadingDiv = getLoadingHtml(msg);
var h = $(document).height();
$(".overlay").css({"height": h});
var div = $("body").find("#loadingDiv");
div.remove();
$("body").append($(loadingDiv));
}
/**
* loading, ajax
* @param msg ," ", " ", " "
*/
function startLoading(msg) {
ajaxLoadingInit(msg);
$(".overlay").css({'display':'block','opacity':'0.8'});
$(".showbox").stop(true).animate({'margin-top':'300px','opacity':'1'},200);
}
/**
* , ajax (complete)
*/
function endLoading() {
$(".showbox").stop(true).animate({'margin-top':'250px','opacity':'0'},400);
$(".overlay").css({'display':'none','opacity':'0'});
}
3.호출 예:
startLoading();
$.ajax({
type : "POST",
url : this.url,
dataType : "json",
data : this.args,
success : function (data) {
},
complete : function () {
if (self.showLoading == true) endLoading();
},
error : this.error
});
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
jquery animate 마우스 올 려 놓 기 숨 김 효과 보이 기1.CSS 스타일: 2.JS: 3.호출 예:...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.