فعاليات المنتدى بتأثيرات الجافا [Java-Slider] الاحترافية







السلام عليكم ورحمة الله وبركاته والصلاة والسلام على رسول الله سيدنا محمد وعلى آله وصحبه أجمعين // كل عام وأنتم بخير أعضاء المعهد الكبير ترايدنت أسعد الله أوقاتكم بكل خير // في مشاركتي الأولى في هذا المنتدى الطيب أحببت أن أشارككم حركة جميلة قمت بتجربتها في موقعي

والحمد لله نجحت بها مع العلم أني لست مبرمجاً أو خبيراً في هذا المجال لكن لنقل ، فكرت في الموضوع قليلاً حتى نجح الفكرة مقتبسة من إحدى الستايلات التي رأيتها هنا لكن للأسف لا أذكر الستايل بالضبط

- المميز في الـ Java-Slider :~... تم طرح موضوع في ترايدنت بخصوصه ، لكنه كان يعمل فقط مع مجلة VBadvanced وكان محدود الميزات، لكن ما أقدمه لكم اليوم فيه ما يلي: 1. لا يشترط وجود أي مجلة لتركيبه ، فهو يعمل مع جميع الإصدارات*. 2. يعرض الشريط فعاليات المنتدى بالصور وبأي مقاس تريد**. 3. يعرض نصاً رئيسياً يمثل عنوان الفعالية ، ونصاً ثانوياً يمثل ملخصاً عنها. 4. الانتقال التلقائي للصور مع إمكانية التنقل اليدوي من أزرار الأسهم ، أو الضغط على كلمة More لاختيار من الصورة المصغرة. 5. يمكنك تغيير تنسيقه كاملاً (طول - عرض - لون الخلفية ) من خلال ملفي الـ CSS المرفقان معه. 6. تمت تجربته على الإكسبلورر والأوبرا والفايرفوكس وهو يعمل بكفاءة. * يعتمد ذلك على عمل هاك "إعلانات في الصفحة الرئيسية" في منتداك وهو يعمل مع نسخ 3.8 بكفاءة. ** يفضل اختيار صور بلاحقة JPEG وتصغير حجمها قدر الإمكان. صورة لشريط الفعاليات (انتظر حتى تحميل الصورة):

- التركيب :~.. :: أولاً - المتطلبات :: ~ ملفات CSS للتحكم بالتنسيق ~ ملفات Java Script ~ هاك "إعلانات في الصفحة الرئيسية" تجدونها جميعاً في المرفقات

رمز PHP:
<script type="text/javascript">
            function 
startGallery() {

                  var 
myGallery = new gallery($('myGallery'), {
                    
timedtrue
                
});
            }
            
window.addEvent('domready',startGallery);
        
</script>
        

<div class="content"> 
            <div id="myGallery">
            <div class="imageElement">
                    <h3>عنوان الفعالية الأولى</h3>
                    <p>ملخص الفعالية الأولى  </p>
                    <a href="رابط موضوع الفعالية الأولى" title="عنوان موضوع الفعالية الأولى" class="open"></a>
                    
                    <img src="رابط صورة الفعالية الأولى" class="full" />
                    <img src="رابط مصغر الفعالية الأولى" class="thumbnail" />

                  </div>
                
                <div class="imageElement">
                    <h3>عنوان الفعالية الثانية</h3>
                    <p>ملخص الفعالية الثانية  </p>
                    <a href="رابط موضوع الفعالية الثانية" title="عنوان موضوع الفعالية الثانية" class="open"></a>
                    
                    <img src="رابط صورة الفعالية الثانية" class="full" />
                    <img src="رابط مصغر الفعالية الثانية" class="thumbnail" />

                  </div>

              
    
        </div>
        </div> 

2. ضع هذا الكود في هيدر الستايلات جميعاً لتضمن عمل الشريط فيها بالكامل

رمز PHP:
  <link rel="stylesheet" href="Java-Slider/css/jd.gallery.css" type="text/css" media="screen" />
        <
link rel="stylesheet" href="Java-Slider/css/layout.css" type="text/css" media="screen" />
        <
script src="Java-Slider/scripts/mootools-1.2.1-core-yc.js" type="text/javascript"></script>
        <script src="Java-Slider/scripts/mootools-1.2-more.js" type="text/javascript"></script>
        <script src="Java-Slider/scripts/jd.gallery.js" type="text/javascript"></script> 

3. قم برفع المجلد Java-Slider إلى مجلد منتداك الرئيسي ، وبذلك يكون التركيب قد انتهى. - ملاحظات مهمة :~.. 1. يجب مراعاة حجم الصور لتتناسب مع حجم الشريط كما تحدده من تنسيق ملفي الـ CSS ( الافتراضي للصور 767 * 310 ) . 2. يمكن إضافة عدد لا نهائي من الفعاليات بتكرار الكود التالي في هاك الإعلانات:

رمز PHP:
    <div class="imageElement">
                     <
h3>عنوان الفعالية </h3>
                     <
p>ملخص الفعالية </p>
                     <
a href="رابط موضوع الفعالية " title="عنوان موضوع الفعالية " class="open"></a>
                   
                     <
img src="رابط صورة الفعالية " class="full" />
                     <
img src="رابط مصغر الفعالية " class="thumbnail" />
                  </
div

فوق الوسمين

رمز PHP:
        </div>
         </
div

الموجودين في آخر الكود في الخطوة رقم 1 من خطوات التركيب ، وقد جعلت المسافة بينهما وبين بقية الكود كبيرة لسهولة التمييز. 3. يمكن وضع نفس رابط الصورة الخاصة بالفعالية في خانة رابط الصورة المصغرة للفعالية وسيتم تصغيرها تلقائياً عند العرض. 4. يجب أن يكون هناك على الأقل فعاليتين ليعمل الشريط. 5. الملفات المطلوبة في الموضوع مرفقة، بالإضافة لصورة لعمل الشريط في حال لم يظهر عند البعض. 6. لتغيير الفعاليات في المستقبل كل ما عليكم هو تغيير الروابط الخاصة باسم وصورة الفعالية في هاك الإعلانات من خيارات المنتدى. 7. معرفتي بالـ CSS شبه معدومة ، واعتمدت على التجربة والخطأ لتنسيق العرض ليتناسب مع منتداي، لذا أعتذر عن الأسئلة المتخصصة بالتنسيق. الموضوع القادم بإذنه تعالى -=> مشغل صوتي متعدد الأشكال في رئيسية المنتدى بتحكم كامل لإضافة الملفات الصوتية التي تريد لأعضائك أن يستمعوا إليها مثال حي >> منتديات مساحات بيضاء آمل أن أكون قد وفقت في طرح الموضوع لا تنسوني من صالح دعائكم بصدق WhiteSpacez


للتحميل :

نوع الملف : zip Java-Slider.zip (91.6 كيلوبايت

نوع الملف : zip Demo.zip (2.15 ميقابايت

نوع الملف : zip إعلانات في الصفحة الرئيسية.zip (1.5 كيلوبايت


http://www.traidnt.net/vb/showthread.php?t=1667977