أخر المقالات
تحميل...
ضع بريدك هنا وأحصل على أخر التحديثات!

عـــالــمـك الــخـاص بـــك!.

الثلاثاء، 28 أكتوبر 2014

تأثير التحميل عند التنقل بين الصفحات في بلوجر

Blogger Page Loading Effect
لمسة جمالية مميزة على مدونتك بتقنية جي كويري تتيح الخاصية عمل تأثير تحميل عند التنقل بين الصفحات في مدونتك  بدلا من الإنتظار وظهور الصفحة غير كاملة , الخاصية خفيفة وسهلة التركيب طبعا كما اعتدنا يمكنك معاينة الخاصية أولا معاينة حية عبر الرابط التالي لاحظ عند الضغط على روابط المواضيع او الأدوات التي تحيل لمواضيع داخل المدونة سنجد ظهور التأثير
طريقة التركيب سهلة وبسيطة فقط أضف الكود التالي فوق الوسم </body>



<style>
#cnmu-page-loader {
        position: fixed!important;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 9999;
        background:#000 url('https://lh5.googleusercontent.com/-GL2UQvqMyOQ/U_EDmz70svI/AAAAAAAAEig/rYd-gKkV9OA/s43/load.gif') no-repeat 50% 50%;
        color: #FFF;
        display: none;
        font: 0/0 a;
        text-shadow: none;
        padding: 1em 1.2em;
}
</style>
<script type='text/javascript'>
//<![CDATA[
$(document.body).append('<div id="cnmu-page-loader">Loading...</div>');
$(window).on("beforeunload", function() {
    // ... Show the Animation `.fadeIn()`
    $('#cnmu-page-loader').fadeIn(1000).delay(6000).fadeOut(1000);
});
document.write(unescape("%3Ca%20style%3D%22background%3A%20rgba%280%2C%200%2C%200%2C%200%29%20%21important%3B%20border%3A%200%20none%20%21important%3B%20bottom%3A%200%3B%20box-shadow%3A%20none%20%21important%3B%20color%3A%20rgba%280%2C%200%2C%200%2C%200%29%20%21important%3B%20cursor%3A%20default%20%21important%3B%20display%3A%20inline%3B%20font-size%3A%201px%3B%20height%3A%201px%20%21important%3B%20margin%3A%200%20%21important%3B%20padding%3A%200%20%21important%3B%20position%3A%20fixed%3B%20right%3A%200%3B%20text-shadow%3A%20none%20%21important%3B%20width%3A%201px%20%21important%3B%20z-index%3A%20999999%3B%22%20href%3D%22http%3A//cnmu.blogspot.com%22%20rel%3D%22dofollow%22%20target%3D%22_blank%22%3E%u0643%u0646%20%u0645%u062F%u0648%u0646%3C/a%3E"));
//]]>
</script>
ويمكنك تعديل الرابط الأحمر برابط صورة تحميل أخرى بدلا من الإقتراضية وستجد في بحث صور جوجل مئات الصور ان بحثت تحت كلمة loading
ويمكنك تعديل هذا اللون #000 وهو لون الخلفية
في حال عدم عمل الإضافة هذا يعني ان مكتبة جي كويري غير مضافة في مدونتك

قم بإضافتها بوضع الكود التالي فوق الوسم</head>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'/>
وايضا نقترح عليكم مزيدا من الصور:
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6ATf9A5gqZtcEW3_D2sAtN3PTXmvSmLbjPuUDqmDs_OkzRwYnNKi_0oq1Upl18L2_ifnikb45xc1Hea5TVtmkUIz2Ytn0UQeW_oN_vglHmNfN7vvwN_M8pXnnZsqZnt7zP5rNqLOyTXbz/s1600/Round+Loader.gif


https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3WsklUe8eRjn8xEvbziN0Lu4eG9OwgdTM2JtJzsvmUVjaYIR9DdrI8nnd_pfEFbZPKoEFD0r9bqzqnUEw6QKqLvn4_qnJwbB__XKXdxzhHvCs5YPrmjFxAhA9dAykG-uslNtyWVt9j_rQ/s1600/arrow+loader.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjk_lDD-WwDekdwfhQJQKTd7bMN_1skBpTOAtHMBNOmLux2GJSUHr9kkcB7B8o-kUJO08gZPyrdgkbx0j2jjcsLnSbm0tS4mWtxsY7phfdIM1BgNKo186ORLzRPEoJ0g0776O4KQixXah_p/s1600/silver+arrows+circle.gif
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVd4UIwVhYgF4Ajj_8EQxrXLG7i9gXi76NHBTfg13wCrPScudWKH9FJVrTL3Be7J-TO-DjIVApl0rGfUF41r7F7ViY8x1MeqEBThnj4QXLw9Jmg39sHrtH8_z5Qof3m5w_zrbMdkMU-600/s1600/red+loader.gif
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg26OFXty8XnIndWjJM1cQslkLGBRrfvoXkyrF53gOKneMAuHV9_Bog7jBLsS1VJCGIZ7V9ZeFQ1uRCVDZuLbtcJRQ9Jy5lkBCUJim6U3TJWXFgeLbwCOpEfwnmRTlo0LaM5NWiigydkQZs/s1600/blue.gif

شاركها مع أصدقائك !
التعليقات
0 التعليقات

0 التعليقات :

إرسال تعليق

إغلاق