تسريع تحميل صفحات المدونة مع اضافة jQuery Lazy Load
الزيارات:

AboYazan | الجمعة, يونيو 22, 2012 |

اضافة جديدة تمكنك من تسريع تحميل الصور في مدونتك و بالتالي تسريع التصفح.
إضافة ممتازة لتسريع تصفح المدونة أو أي موقع على حد سواء، مبدأ الإضافة يتلخص في تحميل ما يراه المتصفح أولا ثم تحميل بقية الصور و المحتويات عند الطلب فمثلا عند تصفح صفحة ما ستلاحظ و أنت تنزل إلى أسفل الصفحة أن الصور و المحتويات تظهر تباعا بطريقة سلسة. باختصار الإضافة تتيح تحميل ما يظهر على الشاشة و ليس صفحة الموقع كلها الشيء الذي يزيد في سرعة تحميل و تصفح موقعك.



طريقة تركيب الإضافة
و تكون بإضافة الكود الآتي فوق (قبل) وسم </body> المغلق:هذا الكود لتطبيق الإضافة على كافة صور الموقع أو المدونة.

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js?ver=1.4.2' type='text/javascript'/>
<script src='http://sites.google.com/site/simoxooorg/Home/jquery.lazyload.mini.js?ver=1.5.0' type='text/javascript'/>
<script type='text/javascript'>
jQuery(document).ready(function($){
if (navigator.platform == &quot;iPad&quot;) return;
jQuery('img').lazyload({
effect:&quot;fadeIn&quot;,
placeholder: &quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0UOa9y5qT-a0KZFA5OadyHfA7rO5-i5G_R8fv17uzv5eojDabcNFU7lwYBoMbbVeMQ4tyDVDbFCiwuNNYbFcmch1mlT7VF_7XWff5Z9qFkWvLd2Ygv9I1mTXZeQoQdAi6eFd1-uckWw/&quot;
});
});
</script>


ملاحظة

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

لتطبيق الإضافة فقط على جسم الموضوع أو التدوينة فقط أضف الكلاس أو ال id المراد التطبيق عليه فقط إلى يسار ما لون بالأحمر كما توضحه الأمثلة الآتية.

فمثلا في بلوجر نطبق الإضافة على .post نستعمل الكود كما يلي:

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js?ver=1.4.2' type='text/javascript'/>
<script src='http://sites.google.com/site/simoxooorg/Home/jquery.lazyload.mini.js?ver=1.5.0' type='text/javascript'/>
<script type='text/javascript'>
jQuery(document).ready(function($){
if (navigator.platform == &quot;iPad&quot;) return;
jQuery('.post img').lazyload({
effect:&quot;fadeIn&quot;,
placeholder: &quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0UOa9y5qT-a0KZFA5OadyHfA7rO5-i5G_R8fv17uzv5eojDabcNFU7lwYBoMbbVeMQ4tyDVDbFCiwuNNYbFcmch1mlT7VF_7XWff5Z9qFkWvLd2Ygv9I1mTXZeQoQdAi6eFd1-uckWw/&quot;
});
});
</script>
و في المنتديات على .tborder يصبح الكود كالآتي:
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js?ver=1.4.2' type='text/javascript'/>
<script src='http://sites.google.com/site/simoxooorg/Home/jquery.lazyload.mini.js?ver=1.5.0' type='text/javascript'/>
<script type='text/javascript'>
jQuery(document).ready(function($){
if (navigator.platform == &quot;iPad&quot;) return;
jQuery('.tborder img').lazyload({
effect:&quot;fadeIn&quot;,
placeholder: &quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0UOa9y5qT-a0KZFA5OadyHfA7rO5-i5G_R8fv17uzv5eojDabcNFU7lwYBoMbbVeMQ4tyDVDbFCiwuNNYbFcmch1mlT7VF_7XWff5Z9qFkWvLd2Ygv9I1mTXZeQoQdAi6eFd1-uckWw/&quot;
});
});
</script>
فقط لا اريد سوا دعواتكم و بالتوفيق للجميع
الأقسام :-
كاتب الموضوع

بقلم :- مصطفى

مصطفى صاحب موقع ستارت كاش من مصر، أكتب عادة حول طرق تحسين مدونات بلوجر و طرق الربح من الأنترنت. يمكن متابعتي على تويتر Twitter أو عبر خلاصات موقعى هذه.

شارك أصدقاءك

روابط هذه التدوينة قابلة للنسخ واللصق
URL
HTML
BBCode

0 تعليقات :- :

إرسال تعليق