منتديات احفاد الرسول
هل تريد التفاعل مع هذه المساهمة؟ كل ما عليك هو إنشاء حساب جديد ببضع خطوات أو تسجيل الدخول للمتابعة.

منتديات احفاد الرسول

بسم الله الرحمن الرحيم قُلْ هُوَ اللَّهُ أَحَدٌ اللَّهُ الصَّمَدُ لَمْ يَلِدْ وَلَمْ يُولَدْ وَلَمْ يَكُن لَّهُ كُفُوًا أَحَدٌ
 
الرئيسيةأحدث الصورالتسجيلدخولتفسير القران الكريم قراءة القران الكريماذاعات القران الكريمكتبقنواتقصص رائعة منتديات الياس عيساوي بث قناة الجزيرةاوقات الصلاةاستماع للقراءن الكريم
دليل سلطان للمواقع الإسلامية

 

 أضف صفحة تحميل الموقع بشكل مميز

اذهب الى الأسفل 
كاتب الموضوعرسالة
eliasissaoui
Admin
eliasissaoui


ذكر عدد المساهمات : 16999
تاريخ التسجيل : 04/07/2013
الموقع : https://www.youtube.com/watch?v=QriWAmC6_40

أضف صفحة تحميل الموقع بشكل مميز Empty
مُساهمةموضوع: أضف صفحة تحميل الموقع بشكل مميز   أضف صفحة تحميل الموقع بشكل مميز I_icon_minitimeالثلاثاء فبراير 04, 2014 2:09 am

إخواني الكرام كيف حالكم اليوم بإذن الله سأشرح لكم طريقة لإضافة صفحة تحميل الموقع أو ما يسمى 
Lazy Page Loading

وهي إضافة تظهر عند كل تحميل للمدونة حيت تضهر صورة متحركة قبل إنتهاء تحميل الموقع بالكامل 

وهي إضافة جميلة ومميزة تضفي على المدونة لمسة إحترافية

صورة من الإضافة


أضف صفحة تحميل الموقع بشكل مميز 03-02-2014+01-41-55


هذه صورة لمثال هناك أشكال اخرى سأطرحها في نهاية الشرح بإدن الله

نبدأ على بركة الله

أولا قم بالبحث في القالب عن الوسم التالي ]]></b:skin>

ثم قبله ضع هذا الكود


اقتباس :
#mbl-lazyloading {
position: fixed;
z-index: 50;
top: 0; left: 0;
width: 100%; height: 100%;
background: #FDFEF8 url(هنا ضع صورة التحميل) no-repeat center;
line-height: 350px;
text-align: center;
font-size: 36px;
color: #353231;
text-indent: -9999px;
}
.MD #mbl-lazyloading { display: none; }
@media only screen and (device-width: 768px) {
#loading {
position:absolute;
width:1040px;
min-height:768px;
}
}
#mbl-progress-bar {
position: absolute;
top: 0; left: 0;
background: #de1301;
opacity: 0.8;
width: 0;
height: 18px;
}
#mbl-loader {
height: 100%;
display: none;
}



بعد ذالك قم بالبحث عن الوسم </head>

ثم فوقه ضه هذا الكود


اقتباس :
<script>
(function($){
$("html").removeClass("MD");

$("#header").ready(function(){ $("#mbl-progress-bar").stop().animate({ width: "25%" },1500) });
$("#footer").ready(function(){ $("#mbl-progress-bar").stop().animate({ width: "75%" },1500) });

$(window).load(function(){
$("#mbl-progress-bar").stop().animate({ width: "100%" },600,function(){
$("#mbl-lazyloading").fadeOut("fast",function(){ $(this).remove(); });
});
});
})(jQuery);
</script>


بعد ذالك قم بالبحث عن الوسم </body>

وفوقه ضع هذا الكود

هذا لإضهار صفحة التحميل فقط في الصفحة الرئيسية


اقتباس :
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<div id='mbl-lazyloading'><div id='mbl-progress-bar'></div><div id='mbl-loader'>This Loading Effect is Powered By<a href="http://www.mybloggerlab.com">MyBloggerLab</a></div></div></b:if>


وهذا لإضهار صفحة التحميل في جميع صفحات مدونتك


اقتباس :

<div id='mbl-lazyloading'><div id='mbl-progress-bar'></div><div id='mbl-loader'>This Loading Effect is Powered By<a href="http://www.mybloggerlab.com">MyBloggerLab</a></div></div>



وآخر خطوة وهي إختيار الشكل الذي تريد بالنسبة للصورة المتحركة وههي بعض الامثلة



أضف صفحة تحميل الموقع بشكل مميز MBL-Loading-1


أضف صفحة تحميل الموقع بشكل مميز MBL-Loading-2

أضف صفحة تحميل الموقع بشكل مميز MBL-Loading-3


أضف صفحة تحميل الموقع بشكل مميز MBL-loading-4


أضف صفحة تحميل الموقع بشكل مميز MBL-loading-5


أضف صفحة تحميل الموقع بشكل مميز MBL-loading-6


أضف صفحة تحميل الموقع بشكل مميز MBL-loading-7



قم بإختيار الصورة التي تريد ثم إنسخ رابطها وضعه في الكود الاول بدل كلمة  "هنا ضع صورة التحميل"


هذا كل شيئ اتمنى ان تعجبكم الإضافة بالتوفيق للجميع ودمتم في رعاية الله وحفظه

 
أضف صفحة تحميل الموقع بشكل مميز 8RTb7-yuUbw?utm_source=feedburner&utm_medium=email
الرجوع الى أعلى الصفحة اذهب الى الأسفل
https://info-noor-islam.ahlamontada.com
 
أضف صفحة تحميل الموقع بشكل مميز
الرجوع الى أعلى الصفحة 
صفحة 1 من اصل 1
 مواضيع مماثلة
-
» أضف نموذج مراسلة بلوجر بشكل مميز فى صفحة مستقلة
» أداة إتصل بنا في صفحة مستقلة بشكل إحترافي
» كيفية عرض المدونات داخل مدونتك بشكل مميز
» إضافة التسميات بشكل مميز مع عداد للمواضيع
» أزرار المواقع الإجتماعية بشكل بسيط وتأثير مميز

صلاحيات هذا المنتدى:لاتستطيع الرد على المواضيع في هذا المنتدى
منتديات احفاد الرسول :: منتدى: المعلوميات :: إضافات بلوجر المميزة Blogger widget-
انتقل الى:  
تعليقات فيسبوك

تابعنا على فيسبوك
أضف صفحة تحميل الموقع بشكل مميز Flags_1
online
تويتر طائر


هذه الرسالة تفيد أنك غير مسجل .

و يسعدنا كثيرا انضمامك لنا ...

للتسجيل اضغط هـنـا