2008 9 ديسمبر 2008

بسيط كاروسيل مع ترحيل عن طريق Mootools

مع مجموعة متنوعة من دوارات هناك، والعديد من Mootools كذلك، قررت أن أكتب لا يزال صفي كاروسيل الخاصة، لبعض أسباب وجيهة
1. يريد ميزة الترحيل (لتكون قادرة على القفز شريحة معينة / خطوة في دائري).
2. أراد الحرية مع التنسيب من الأزرار اليسار واليمين / وصلات، حيث من أي وقت مضى لي من فضلك.
3. مزيد من السيطرة على خطوات الشرائح.

أنا لم يتمكن من خلق كاروسيل جديد، مع ميزات أعلاه ... على النحو التالي ... لا تتردد في اقتراح أي تعديلات تقوم سيتطلب!

بلدي على سبيل المثال يبدو مثل هذا ... [ عرض الفيلم ]
Mootools كاروسيل مع ترحيل

عرض تجريبي | تحميل Mootools كاروسيل مع ترحيل الإصدار 1.0 (يتم تنزيله 1981 مرة)


1. دائري ترحيل

يمكنك بسهولة إضافة إلى ترحيل دائري الخاص، وذلك ببساطة من خلال وضع علامة الترحيل، والذي هو parater الماضي مرت أثناء إنشاء مثيل من MooCarousel إلى الحقيقية (أريد الترحيل) أو خطأ (متأكدا يريد ترحيل).

فار carousel1 = جديد MooCarousel ('carousel1_wrapper'، 'carousel1_items_container'، 'carousel1_moveleft'، 'carousel1_moveright'، c_ns، c_sss، صحيح)؛ / / نانوثانية = عدد من الشرائح، ونظام الضمان الاجتماعي خطوة الشريحة = حجم

ويمكن أن فكورسي تغيير هذه النظرة achors ترحيل-N-يشعر كما تريد من خلال تعديل CSS الخاصة بهم.

. carousel_paging {مواءمة النصوص: حق؛ الهامش: 5PX 10px 0 0؛}
. carousel_paging الحالي، carousel_paging الصفحة {الخطوط العريضة: لا شيء؛ العرض:. 15px؛ الطول: 15px؛ خط الطول: 15px؛ مواءمة النصوص: المركز؛ العرض: كتلة، تعويم: غادر؛ خلفية: # D8D8EB؛ هامش: 0 1px 0 0؛ النص الديكور: لا شيء؛}

. carousel_paging أ: تحوم، carousel_paging الحالية {خلفية: # 4D4D9B؛ اللون: # FFFFFF؛}.

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

2. Customising رموز اليسار واليمين

يمكنك تغيير موضع أو الصور أو أي ممتلكات displat من أزرار اليمين واليسار لمجرد اللعب حولها مع CSS. لتكون قادرة على تغيير المواضع من buttoms اليسار واليمين وكان السبب الحقيقي بالنسبة لي أن حق طبقتنا بلدي كاروسيل.
منذ هذه الفئة MooCarousel، يقبل معرف لهذه الأزرار، يمكنك وضع هذه الأزرار في الواقع في أي مكان على الصفحة، وإذا كنت من فضلك ... لا يجب أن تكون في التسلسل الهرمي عنصر، كما هو الحال في بلدي على سبيل المثال.

فار carousel1 = جديد MooCarousel ('carousel1_wrapper'، 'carousel1_items_container'، 'carousel1_moveleft'، 'carousel1_moveright'، c_ns، c_sss، صحيح)؛

CSS
.. carousel_container_l، carousel_container_r {الهامش: 50px 0 0 0؛ الموقف: النسبية؛ العرض: 23px؛ الطول: 20px؛ تعويم: غادر؛ المؤشر: المؤشر؛}

. carousel_container_r {الخلفية الموقف: 0-38px؛}

. carousel_container_l {الخلفية الموقف: 0-58px؛}

3. Customising خطوات الشرائح

ماذا يعني خطواتي SLIDE CUSTOMISING؟
معظم دوارات حرك كامل مع الإطار مرئية. لذلك نقول لكم كان أربعة وحدات (كما هو الحال في عينتي أعلاه)، فإنه ينزلق جميع البنود الأربعة. مع هذا المكون كاروسيل، يمكنك تمرير عدد من الشرائح وحجم الخطوة التي تختارها.

فار carousel1 = جديد MooCarousel ('carousel1_wrapper'، 'carousel1_items_container'، 'carousel1_moveleft'، 'carousel1_moveright'، c_ns، c_sss، صحيح)؛
c_ns = عدد من الشرائح، c_sss خطوة الشريحة = حجم

أيضا، في example1 لي لقد calcuted حجم الشريحة الخطوة، على أساس منطق حيث، وأنا أعرف عددا من البنود، عرض على كل بند والهوامش التي قدمت بعد كل عنصر في CSS بي.

/ * للإحتفال صاخب مخمور 1 * /

فار c1_w = 92؛ العرض البند / / إحتفال صاخب مخمور

فار c1_n = 10؛ عدد / / الإجمالي للعناصر إحتفال صاخب مخمور Comparision

فار c1_pp = 4 / / عدد من إحتفال صاخب مخمور Comparision عناصر perpage

فار c1_marginFactor = 51؛

فار c1_sss = c1_w * c1_pp / / نظام الضمان الاجتماعي خطوة الشريحة = حجم

فار c1_ns parseInt = (((* c1_w c1_n) / c1_sss) + 0.5) / / نانوثانية = عدد الشرائح

c1_sss + = c1_marginFactor / / الشريحة = SSS حجم الخطوة، و 51 للهوامش


المتطلبات: Mootools 1.2

عرض تجريبي | تحميل Mootools كاروسيل مع ترحيل الإصدار 1.0 (يتم تنزيله 1981 مرة)


2008 2 ديسمبر 2008

تقييم بسيط عبر متصفح سيناريو Mootools

Mootools MooRating هو (عبر متصفح، وبطبيعة الحال لأنه يستخدم القوة من مكتبة MooTools) بسيطة وخفيفة الوزن وممتازة تستند حل التصويت. لم يتم وصفته بانه "تقييم ستار"، وذلك ببساطة، فإن الصورة يمكن أن يكون التصويت على النحو الذي تختاره (لقد قدمت نجوم والحانات وهارتس مع التحميل، ولكن هل يمكن أن تخلق مجموعة خاصة بك، ومجرد قطرة في).

كيف يبدو:

Mootools التقييم مع صور مختلفة عرض الفيلم
Mootools التقييم مع قيم النسبة المئوية عرض الفيلم
Mootools التقييم مع القيم كسور عرض الفيلم

تنزيل تصنيف بالنجوم Mootols النصي (تم تحميلها 716 مرة)

تصنيف البيانات: رقم الجامعة، عشري أو النسبة المئوية
حاليا تم تصميم البرنامج النصي لإظهار البيانات تصنيف كقيم كله (1،2،3،4،5)، في العشرية (1.24، 3.45، الخ) أو في النسب المئوية (12٪، وما إلى ذلك 55٪). يمكن تعيين الخيار لإظهار البيانات في أي من التنسيقات المذكورة ببساطة عن طريق تغيير بعض القيم العلم داخل جافا سكريبت (moorating.js)
أساسا هناك نوعان من البريد علمين للعب مع، لعرض القيم في الشكل الذي تختاره ...

فار inpercent = كاذبة؛ مجموعة / / هذا العلم صحيح، إذا كنت بحاجة ليتم عرضها قيم النسبة المئوية
فار isFractional = مجموعة كاذبة / / هذا صحيح، إذا كنت تريد القيم كسور مثل 1.24، 4.56، 1.25 بدلا من 1،2 ... 5

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

إذا كان (isFractional) {إذا كان (س <= 5 | | X> = 0) moostartval [ط] innerHTML = formatNumber (س، 3)؛.} يتم تغيير / / 2 الى 3
آخر رد moostartval [ط] innerHTML = Math.round (خ)؛

تحديث قيمة التقييم:
أنا [هفنت] ازعجت كتابة أي نصوص أجاكس لاستكمال قيمة التقييمات، لأنني أعرف من خلال تجربتي أنه لا يفعل ذلك دائما تنوي تحديث RATING في أقرب وقت ممكن للمستخدم معدلات شيء. أنت حر لتفعل ما تريد مع قيمة التصويت عليها، وتحديثه، باستخدام أجاكس أو إرسال أو تعيين حقل نموذج مخفي قيمة، لتقديمها مع النموذج بأكمله الخ.

updateRating وظيفة (الهوية، والتصويت) {
/ / حالة تأهب (معرف + "،" + تصنيف)؛
/ / اعملوا ما مع تصنيف
}

هناك وظيفة في جافا سكريبت يسمى "updateRating". وقد مرت هذه الوظيفة على هوية من الدرجة التقييم، للتعرف على النحو الذي التقييمات (إذا كان هناك أكثر أن أحد تقييمات على الصفحة) تم تحديث وقيمة التصويت [updateRating (الهوية، والتقييم)]. هل يمكن أن تختار ما تريد مع هذه القيم، وكما ذكرت سابقا.

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

. moostar {هامش: 0px؛ الحشو: 0px؛ الفائض: خفي؛ العرض: 84px؛ الطول: 20px؛ تعويم: غادر؛ خلفية: عنوان ('stars.gif') كرر-X؛}
. moostar فترة {تعويم: غادر؛ الهامش: 0px؛ الحشو: 0px؛ العرض: كتلة؛ العرض: 84px؛ الطول: 20px؛ النص الديكور: لا شيء؛ النص البادئة:-9000px؛ Z-الفهرس: 20؛}
.. moostar عملة التداول {خلفية: عنوان ('stars.gif') غادر 25px؛}

معظم تقييمات الحاجيات استخدام نجمة والصور نصف نجمة مع الماوس فوق الأحداث على كل نجمة. التقييمات مو يستخدم صورة بسيطة العفريت كصورة خلفية لتحقيق التأثيرات البصرية المطلوبة مع ارتفاع منخفض جدا.

المتطلبات: Mootools 1.2
تنزيل تصنيف بالنجوم Mootols النصي (تم تحميلها 716 مرة)


2008 24 أكتوبر 2008

Mootools المتزلج مع اثنين من المقابض (المتزلج مثبت مزدوجة) مع مؤشر متوسط

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

عرض الإصدار 2.2 التجريبي | Mootools تحميل مثبت مزدوج المتزلج النسخة 2.2 (تم تحميلها 11539 مرات)
mootools المنزلق دبس مزدوج

يمكنك بسهولة جدا تغيير الشكل والمظهر من مؤشر المدى (باللون الأزرق في المثال أعلاه)، مقبض الباب المنزلق، المسار المنزلق عن طريق تعديل slider.css على النحو المطلوب.

لا قطرة لي تعليق اذا وجدت أنه من المفيد.


2008 11 أغسطس 2008

تحميل هذا فو قالب وورد المتمركزة

إذا كنت واحدا من هؤلاء الرجال (مثلي)، الذي تحقق في كثير من الأحيان المغلق من صفحة HTML جيدة الصنع، لمعرفة أفكار جديدة أو أيا كان، ثم كنت قد لاحظت أننا قد تستخدم لتحديد المواقع FAUX (كما سبق ذكره في مقالتي السابقة ونحن باستخدام الموضع المطلق فو: تخطيط CCS بريليانت )

قمنا بعمل جيد على هذا القالب، حتى ظننت أنه لطيف لتشاركه .... حمل هذا الموضوع وورد (التحميل 195 مرات)


NDK الرئيسية | معربا عن تكنولوجيا المعلومات | الحنك تعرب | Penmenship تعرب | الرهبة تعرب | تعرب عن نفسي