دیجی اسکریپت

لود صفحه قبل از بارگذاری کامل آن | دیجی اسکریپت

لود صفحه قبل از بارگذاری کامل آن

 لود صفحه قبل از بارگذاری کامل آن

 

با سلام خدمت دوستان عزیز وردپرسی!

 

اگر به دنبال این هستید تا قبل از لود کامل صفحه و بارگذاری صفحه تصویری به صورت GIF. در آن نمایش داده شود و پس از اینکه صفحه به صورت کامل لود شد تصویر محو شده و بتوان محتوای سایت را مشاهده کرد تا انتها با ایکس اسکریپت همراه باشید.

 

لود صفحه قبل از بارگذاری کامل آن

 

برای شروع کار ابتدا وارد هاست خود شده و فایل header.php را باز کنید و کد زیر را بعد از تگ <body> در آن قرار دهید.

 

<div class="loader"></div>

 

سپس فایل مربوط به استایل قالب را باز کرده و استایل‌های زیر را به آن اضافه کنید.

 

.loader {
position: fixed;
left: ۰px;
top: ۰px;
width: ۱۰۰%;
height: ۱۰۰%;
z-index: ۹۹۹۹;
background: url('images/page-loader.gif') ۵۰% ۵۰% no-repeat rgb(۲۴۹,۲۴۹,۲۴۹);
}

 

و در نهایت کدهای جی‌کوئری زیر را نیز در فایل header.php و درست قبل از تگ </head> قرار داده و آن را ذخیره کنید.

 

<script src="http://ajax.googleapis.com/ajax/libs/jquery/۱.۹.۱/jquery.min.js"></script>
<script type="text/javascript">
$(window).load(function() {
$(".loader").fadeOut("slow");
})
</script>

 

پس از اینکه تمامی مراحل را به درستی وارد کردید لازم است تا تصویر مورد نظر را که با نام page-loader.gif و در مسیر images قرار دارد را نیز آپلود کنید. که در کدهای css آن را قرار دادیم. و میتوانید از باکس دانلود آن را دریافت کنید.

 

شاد باشید… 🙂

The post لود صفحه قبل از بارگذاری کامل آن appeared first on ایکس اسکریپت.



لینک منبع مطلب

برچسب ها

این مطلب بدون برچسب می باشد.

ارسال دیدگاه جدید

به نکات زیر توجه کنید

  • نظرات شما پس از بررسی و تایید نمایش داده می شود.
  • لطفا نظرات خود را فقط در مورد مطلب بالا ارسال کنید.