السلام عليكم ورحمة الله وبركاته
أعتقد أن جميعكم رأى هذي البرمجة وخصوصاً في Google images
بأن الصور لا تظهر إلى في حال مرورنا عليها
والبرمجة منتشره ايضاً في صفحات الـ wordpress
وهذا يساعد على تخفيف الضغط على الصفحة ويساعد أيضاً على أن يجعل التحميل فقط للمشاركة المراد رأيتها بدل تحميل الصفحة كلها!
حبيت أشاركم في هذي البرمجة لعملها مع منتدياتنا vBulletin 4
للتركيب install:
١- قم بتحميل المرفقات (٢ ملف في مجلد clientscript)
٢- قم بالذهاب إلى قالب template (headinclude)
٣- إبحث عن:
رمز PHP:
<code style="white-space:nowrap"> <code> <script type="text/javascript" src="{vb:stylevar yuipath}/yuiloader-dom-event/yuiloader-dom-event.js?v={vb:raw vboptions.simpleversion}"></script>
</code> </code>
أضف
فوقه:
(في حال رغبتك بظهور الصور بدون تأثير أضف هذا الكود code)
رمز PHP:
<code style="white-space:nowrap"> <code> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script src="clientscript/jquery.lazyload.mini.js" type="text/javascript"></script>
<script type = "text/javascript">
$(function() {
$("img").lazyload();
});
</script>
</code> </code>
(في حال رغبتك بظهور الصور بتأثير الـ fade-in أضف هذا الكود code)
رمز PHP:
<code style="white-space:nowrap"> <code> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script src="clientscript/jquery.lazyload.mini.js" type="text/javascript"></script>
<script type = "text/javascript">
$(function() {
$("img").lazyload({
effect : "fadeIn"
});
});
</script>
</code> </code>
* يرجى عدم وضع الكود codeين ، فقط إختر واحد منهم حسب رغبتك
رابط المثال:
http://zeqiod.webs.com/lazyload.html
* لاحظوا هنا شريط تحريك الصفحة للأسفل والأعلى "scroll bar" كيف يتغير شكله ولاحظوا تأثير ظهور الصوره وانت تضغط على زر تحريك الصفحة للأسفل..
وسلامتكم