• المواضيع الأخيرة
أشخاص في صن سيت
مشاهدة المزيد
استعرض الموضوع السابقاذهب الى الأسفلاستعرض الموضوع التالي

اجعل البانر الخاص بمنتداك متحرك تلقائيا 2016 Empty اجعل البانر الخاص بمنتداك متحرك تلقائيا 2016

اسلام
الادارة العليا

الادارة العليا
اسم الدولة : : مصـــر
العمر : 24
عدد المساهمات : 2283
المعجبون بمواضيعى : 126
معاينة صفحة البيانات الشخصي للعضو
تمت المشاركة في الأحد 8 نوفمبر 2015 - 19:34
بسم الله الرحمن الرحيم
اجعل البانر الخاص بمنتداك متحرك تلقائيا 2016
اهلا وسهلا باعضاء صن سيت الكرام
اليوم اتيت لكم بموضوع حصرى

تقنية جديده لتحويل بانر المنتدى لديك بدل من صورة ثابتة الى سلايد شو مميز

مثال
اجعل البانر الخاص بمنتداك متحرك تلقائيا 2016 Captur12

ملحوظة كتب: قد لا يعمل اذا كنت غيرت معرف البانير الاصلى فى القالب header

طريقة التركيب سهلة جدا فقط الى اكواد الجافا واضف العنصر الجديد
اسم العنصر: كام تشاء
مكان الظهور: جميع الصفحات او كما تشاء ان يعمل السلايد شو
المحتوى: اضف الكود التالى
ضع رد مناسب!!
الكود:


  [hide]      (function() {

          var BannerRotator = {
            images : [
              'http://i21.servimg.com/u/f21/18/21/60/73/free10.png',
              'http://i21.servimg.com/u/f21/18/21/60/73/logo10.png'
            ],
       
            start_delay : 5000,
            duration : 5000,
            height : 'auto',
       
            fade_image : true,
            fade_speed : 1200,
         
            keep_initial : true,
            remember_position : true,
            preload : true,
       
            // technical data below
            index : -1,
            logo : null,
         
            // increment the index and display the next image in rotation after a small delay
            next : function(ms) {
              if (ms === undefined) ms = FA.BannerRotator.duration;
       
              window.setTimeout(function() {
                if (++FA.BannerRotator.index >= FA.BannerRotator.images.length) FA.BannerRotator.index = 0; // reset index when it exceeds "images" length
                if (FA.BannerRotator.remember_position) my_setcookie('fa_banner_index', FA.BannerRotator.index); // remember the last banner shown
             
                // fade banner in and out
                if (FA.BannerRotator.fade_image) {
                  $(FA.BannerRotator.logo).fadeOut(FA.BannerRotator.fade_speed, function() {
                    FA.BannerRotator.logo.src = FA.BannerRotator.images[FA.BannerRotator.index]; // set next banner
                    $(this).fadeIn(FA.BannerRotator.fade_speed, FA.BannerRotator.next); // fade it in
                  });
                }
       
                // default rotation
                else {
                  FA.BannerRotator.logo.src = FA.BannerRotator.images[FA.BannerRotator.index];
                  FA.BannerRotator.next();
                }
              }, ms);
            },
         
            // initial start up to get the correct logo node and setup some other settings
            init : function() {
              var logo = document.getElementById('i_logo') || document.getElementById('logo') || document.getElementById('pun-logo'),
                  index = my_getcookie('fa_banner_index');
               
              if (logo) {
                FA.BannerRotator.logo = logo.tagName == 'IMG' ? logo : logo.firstChild;
                FA.BannerRotator.logo.style.height = FA.BannerRotator.height;
             
                if (FA.BannerRotator.keep_initial) FA.BannerRotator.images[FA.BannerRotator.images.length] = FA.BannerRotator.logo.src;
                if (FA.BannerRotator.remember_position && index) {
                  FA.BannerRotator.index = +index;
                  FA.BannerRotator.logo.src = FA.BannerRotator.images[FA.BannerRotator.index] || FA.BannerRotator.images[0];
                }
             
                FA.BannerRotator.next(FA.BannerRotator.start_delay);
              } else if (window.console && window.console.warn) {
                console.warn('Your forum version is not optimized for this plugin');
              }
            }
          };
       
          if (!window.FA) FA = {};
          if (!FA.BannerRotator) {
            FA.BannerRotator = BannerRotator;
         
            if (FA.BannerRotator.preload) {
              for (var i = 0, j = FA.BannerRotator.images.length, img; i < j; i++) {
                img = document.createElement('IMG');
                img.src = FA.BannerRotator.images[i];
              }
            }
         
            $(FA.BannerRotator.init);
          }
        }());
[/hide]

والان شرح التحكم فى السلايد شو
images : [
'https://i.servimg.com/u/f21/18/21/60/73/free10.png',
'https://i.servimg.com/u/f21/18/21/60/73/logo10.png'
],
هذه المنطقة هى الصور يمكنك اضافة المزيد من الصور عن طريق اضافة سطر يحتوى على الاتى
'رابط الصورة'
وانتبه لوجود العلامتين والا سوف تقوم بتعطيل الكود باكمله
الجزىء الثانى
start_delay : 5000,
وهو مدة الانظار بين الصورة والاخرى 5000 تساوى 5 ثوانى
duration : 5000,
نفس الوظيفة الاختلاف فقط انه يعين مدة الظهور للصورة
height : 'auto',
وهو ارتفاع الصور الوضع الافتراضى هو تلقائى لذا يستحسن استخدام صور بنفس المقاسات او تغير auto الى الارتفاع المطلوب تحديده سواء بالنسبة المئوية او بالبكسل

واذا كان لديك المذيد من الاستفسارات قسم الدعم مفتوح لك فى اى وقت
#جافا #كود #بانر
استعرض الموضوع السابقالرجوع الى أعلى الصفحةاستعرض الموضوع التالي
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى
Top