السلام عليكم
 |
| مثال |
في هذا الشرح السريع سوف نجعل الصور تدور(360درجة) بمجرد مرور الماوس عليها مع تدوير الحواف ايضاً، وهذا سيعطي جانب اكثر جمالاً ومتعة لزوار مدونتك .
اولا:مصطلحات يجب معرفتها في بعض المتصفحات لاتدعم تقنيات css3 ، وحتى نتغلب على ذلك نبدأ دائما التقنيات بالاختصارات التالية وتكون في البداية ، والاختصارات هي:
ثانيا:نبدأبكتابة الكود ادناه في منطقة <head> او في ملف css منفصل ، ساعتمد هنا ملف منفصل، وسوف نلاحظ باننا استخدمنا الاختصارات اعلاه قبل الكود لكي تظهر الحركة على كل المتصفحات، وبما ان الصورة ستدور حول نفسها سنعرفها ب morph.
ثالثا: نضيف كود عند مرور الماوس عليها يبدأ الدوران مع الحواف:
* لاتنسى ان تضيف الكود اعلاه الى نفس ملف css تحت الكود morph مباشرة.
*او يمكنك اضافة الكودين في منطقة الهدر <head> بعد اضافة جملة <style type="text/css">هنا تتم اضافة الكودين</style>.
رابعا:اضافة كود الى منطقة <body> لتعريف الصورة التي سيتم اضافة التاثير عليها كما هو موضح في الصورة ادناه:
*لاتنسى وضع امتداد الصورة مكان bath.
بالتوفيق.
ليست هناك تعليقات:
إرسال تعليق