PDA

View Full Version : ایجاد لودینگ در سایت



alizanganeh
شنبه 23 اسفند 1393, 20:47 عصر
سلام
میخوام برای سایتم یک لودینگ ایجاد کنم که از وقتی که دکمه ای فشرده میشه نمایش داده بشه تا وقتی که اون کار تموم بشه و پنهان بشه
مثل سایت دیجی کالا که پایین عکسشو گذاشتم
فکر کنم با AJAX toolkit باشه ولی نمیدونم چیکار باید کنم . اگر میشه راهنمایی کنید . ممنون

http://8pic.ir/images/y0vfx6r13up25ddzqnst.jpg (http://8pic.ir/)

hamid_0341
یک شنبه 24 اسفند 1393, 07:11 صبح
اول یک div توی صفحه ای که updatepanel داری میسازی

<div id="loading_progress" class="loadingProgress">
<img alt="Loading" src='<%= ResolveClientUrl("~/images/loader/282.GIF") %>' />

</div>

بعد با jquery اینجوری میکنی

prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_beginRequest(function () {

var w = $(".pageContentHolder").width();
var h = $(".pageContentHolder").height();
w = w + 20;
$("#loading_progress").css("height", function () {
return h;
}).css("width", function () {
return w;
});



$("#loading_progress").show().css("opacity", "0");
$("#loading_progress").find("img").center($("#loading_progress"));
$("#loading_progress").animate({
opacity: 1
}, 400);

});


Sys.WebForms.PageRequestManager.getInstance().add_ endRequest(function () {

$("#loading_progress").fadeOut('fast', function () {
$("#loading_progress").css("width", 0);
$("#loading_progress").css("height", 0);
});
});