المعاينات والمرفقات
مجال التأثيرات الحركية مجال واسع جداً ومن الصعب ان يتم شرحه بالكامل لأنه يعتمد على جزء كبير في لغة CSS لكن هناك حل سهل وبسيط يعتمد عليه أغلب المستخدمون للتأثيرات وهو عبر التأثيرات الجاهزة
وهذا الشرح والكود إعداد حصري لكن مدون
من المعاينة التالية يمكنك رؤية مثال تقريبي لفكرة عمل هذه التأثيرات شاهده ولا تنسى التمرير لأسفل حتى نهاية الصفحة لترى بعض التأثيرات
كيف يمكن عمل تلك التأثيرات ؟
أول شئ استخدم الكود التالي في قالبك<script src='https://googledrive.com/host/0B9wf6r4PTnMianRNWmU0VFdhVHc' type='text/javascript'/>
كل ما عليك فعله هو استخدام الكلاس التالي
رمز # يستبدل بإسم الحركة
مثال لو لدينا صورة نريد ان نطبق عليها الحركة سيصبح كودها كالتالي
<img class="wow animated tada" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgilHzBZddOBXytPeHPORUnNHZGL9oxlfeQXQ4x0_l0R7mYztCVnp2IJd6AbJLD2DA-pAReN6ul1BN345YC_jltGfDr6mCTHjEb8yNcR2GINdQWlKTwrPlq9dJ1MSMdY9w_P7KwWcpJ-V-W/s1600/256%25D8%25A1256.png"/>كما تلاحظ كلمة tada هو إسم الحركة
كيف نحصل على اسم الحركة
ببساطة من الموقع التاليhttp://daneden.github.io/animate.css
ستجد معاينة لكل الحركات وأسمائها فقط اكتب اسم الحركة وطبقه على ما تريد يجب أن تكتب الإسم مضبوط
إضغط هنا لفتح قائمة أسماء قابلة للنسخ
مثال آخر لو اردنا تطبيق حركة معينة على مواضيع المدونة بحيث كلما تم التمرير لأسفل يحدث التأثير على الموضوع
أغلب قوالب بلوجر تعتمد على هذا الكود كحاكم للمواضيع
كل ما عليك فعله تطبيق الكود فيصبح
طبعا يمكنك تعديل التأثير الحركي بالتأثير الذي تريد
ملحوظة قد يكون الكود متكرر في القالب فيجب التطبيق عليهم جميعا أو التجربة حتى تجد الصحيح
الاشتراك في:
تعليقات الرسالة (Atom)
شكرااااااااااااااا لقد انتضرت هادا الموضوع لوقت طويل اخي (: كان يبدوا لي ان هاده الحركات تستخدم بلغة jquery
ردحذف^_^ معذرة على التأخر لكن مشاغل الحياة تأخذنا منكم قليلاً
حذفبالتوفيق
جميل لاكن ممكن طريقة رفع علي موقع github
ردحذفأهلا بك أخي الكريم
حذفالحقيقة انا اتجنب قدر الإمكان شروحات المواقع لانها تتغير كثيراً ويصعب مواكبة تلك الشروحات
إضافة ان تلك الشروحات لا تفيد جميع المدونين فقط فئات بسيطة وانا اهدف لوضع الشروحات العامة التي يحتاجه كل مدون
لا هتفيد المدونين الي بيعربو او بيطورو القوالب هيحجوها في رفع ملفات js او ملفات الحقوق وكدا وانتا عارف بقا =D
حذفاخي الكريم من يعرب ويطور القوالب ليس مدون , بل هو مطور ويب , انا هنا في المدونة اقدم الخدمات للمدونين الذين يهدفون لتحسين مدوناتهم أما المطورين هناك مواقع أخرى لخدمتهم وهذه امور بسيطة اى مطور متوسط الخبرة على علم بها بالتالي تلك الشروحات لن تكون ذات قيمة للمدونين لأن وظيفة مدونتي هي اعطاء المدون إضافة جاهزة يستخدمها دون ان يقلق من ضياع الملفات وهذا اضمنه لزواري بإذن الله
حذفالسلام عليكم
ردحذفبصراحة أول مدون في العالم العربي هو أنت أخي"كن مدون" أنت من اهل الفردوس إن شاء الله
نستفيد منك لنواصل مهامنا ♥
نحبك في الله ونتمنى مواصلة مشوارك
محبكم من الجزائر ♥
وعليكم السلام ورحمة الله وبركاته
حذفنسأل الله ان يجعلنا واياكم من اهل الفردوس
تشرفت بمرورك وحيا الله اهل الجزائر الحبيب
موضوع رائع صديقي وشكراً على الشرح والوافي، شرح مميز ومبسط :)
ردحذفhttp://www.0prof0.com
شرح موفق وجميل ابدعت
ردحذفبجد شرح ممتاز جزاك الله خير يا استاذ عمرو ربنا يباركلك يارب
ردحذفرائع جدا بارك الله فيك
ردحذفبارك الله فيك ممتاز اخي .. اتمني من حضرتك تغير رابط المعاينة عشان مش شغال
ردحذفوفيك بارك الله اخي الكريم
حذفمدونة المعاينة بها كل معاينات مدونتي تقريباً
لكنها حذفت هناك طلب لإستعادتها وستعاود العمل بإذن الله
حاليا يمكنك معاينة التأثيرات في موقع اسماء الحركات
تشرفت بمروركم اخواني الأفاضل
ردحذفتحياتي لكم جميعاً
السلام عليكم ورحمة الله
ردحذفكيف اطبفها على عنوان المونة.
وعليكم السلام ورحمة الله وبركاته
حذفبنفس الطريقة التي في الشرح اخي طبقها على الكلاس الخاص بالعنوان او إضافة رأس الصفحة التي تستخدمها في العنوان
اخى ممكن أسم التأثير الى حضرتك عملوا على صندوق التعليق
ردحذفأخي لو شاهدت التأثيرات في الرابط الذي وضعته ستستطيع تمييزه
حذفعموما هو flipInX
وبالتوفيق
وعليكم السلام ورحمة الله وبركاته
ردحذفأخي لو نظرت للقوالب في المعاينة ووجتها تعمل جيداً
فتكون المشكلة لديك اما في المدونة او في الدومين المدفوع واعداداته ان كنت تستخدم واحد او انك عدلت على القالب تعديلات بها اخطاء فتسببت بالمشكلة
شكرأ جدأ جدأ على هذا الشرح والله انا كنت بدور على بقالى كثير ويئست من التدوير وانتا الوحيد الى عامل شرح لى التريقه دى ومعرفتش غير وكلعاده لما بشوف الموضيع الجديده بتعتك شوفت الموضوع ده عندك وشرحتو بل تفثير شكرأ لى مجهودك الرائع
ردحذفيسرني أن الشرح أعجبك وأفادتك
حذفشكراً لمرورك العطر يا طيب
حضرتك لو انا عايز اطبق الكلاس ده على المدونه بالكامل اعمل ايه
ردحذفبعد الوسم <body> أضف هذا الكود وطبق عليه التأثير الذي تريد
حذف<div class="wow">
وفوق الوسم
</body>
أضف هذا الكود
</div>
حبيبي شكرا
حذفجاري التجربه
اخى انا فى مدونى اريد اضيف التاثير على المدونه بالكامل
ردحذفولكن انا القالب لا يوجد به وسم <body>
مع العلم أن وسم </body> يوجد فى القالب
ما الحل اذا
لا يمكن اخي ان لا يكون لديك وسم <body>
حذفلانه جزء رئيسي في الصفحة لكن قد يكون شكله متغير فإبحث فقط عن هذا الجزء <body
وجده اخى
حذفولكن كيف اجهله مثل مدونتك عند النزول للاسفل يعمل التاثير
اخي انا ذكرت هذا في نهاية الموضوع راجعه جيداً لن يعمل فقط في حالة كانت مواضيع مدونتك بكلاسات اخرى فعليك ايجادها
حذف