في عرض Design أو Code بمستند Dreamweaver، حدد العنصر المطلوب تطبيق تأثير jQuery عليه.
يمكنك تصميم مواقع جذابة باستخدام تأثيرات jQuery الرائعة. يسمح لك تكامل Dreamweaver مع jQuery بتضمين تأثيرات مثل المنزلقات بدون الحاجة إلى كتابة أية تعليمة برمجية.
إضافة تأثيرات jQuery
حدد Windows > Behaviors لفتح اللوحة Behaviors.
انقر على أيقونة Plus، وانقر على Effects، ثم انقر على التأثير المطلوب.
تظهر لوحة التخصيص مع إعدادات التأثير المحدد.
حدد الإعدادات مثل عنصر الهدف المطلوب تطبيق التأثير علية ومدة التأثير.
يمكن أن يكون العنصر الهدف هو نفس العنصر الذي حددته أولاً أو عنصر آخر في الصفحة. على سبيل المثال، إذا كنت تريد من المستخدمين النقر فوق العنصر A لإخفاء أو إظهار العنصر B، فإن العنصر الهدف يكون B.
لإضافة تأثيرات jQuery متعددة، كرر الخطوات أعلاه.
عند اختيار تأثيرات متعددة، يقوم Dreamweaver بتطبيق التأثيرات بترتيب العرض في اللوحة Behaviors. لتغيير ترتيب التأثيرات، استخدم الأسهم السفلية الموجودة أعلى اللوحة.
يقوم Dreamweaver تلقائيًا بإدخال التعليمات البرمجية المناسبة في المستند. على سبيل المثال، إذا قمت بتحديد التأثير'Fade'، يتم إدخال التعليمات البرمجية التالية:
- مراجع الملفات الخارجية للملفات التابعة المطلوبة لتشغيل تأثيرات jQuery:
<script src="jQueryAssets/jquery-1.7.2.min.js" type="text/javascript"></script><script src="jQueryAssets/jquery-ui-effects.custom.min.js" type="text/javascript"></script>
- يتم تطبيق التعليمات البرمجية التالية على العنصر في علامة الموضوع:
<li id="earthFrm" onclick="MM_DW_effectAppearFade($('#earthForms'),'show','fade',1000)"> Earth Forms</li>
- تتم إضافة علامة نصية بجانب التعليمات البرمجية:
<script type="text/javascript"> function MM_DW_effectAppearFade(obj,method,effect,speed) { obj[method](effect, {}, speed); }</script>
تأثيرات jQuery المستندة إلى الحدث
عند تطبيق تأثير jQuery، يتم تخصيصه لحدث onClick افتراضيًا. يمكنك تغيير حدث التشغيل للتأثير باستخدام اللوحة Behaviors.
حدد عنصر الصفحة المطلوب.
في اللوحة Windows > Behaviors انقر فوق الرمز Show Set Events.
انقر فوق السهم المناظر للتأثير الذي يتم تطبيقه حاليًا. لاحظ أن العمود الأول يتغير إلى قائمة منسدلة توفر الأحداث التي يمكنك الاختيار منها.
انقر فوق الحدث المطلوب.
إزالة تأثيرات jQuery
حدد عنصر الصفحة المطلوب.
تسرد اللوحة Behaviors كل التأثيرات التي يتم تطبيقها على عنصر الصفحة المحدد.
انقر على التأثير الذي تريد حذفه ثم انقر على أيقونة الحذف.
قم بإنشاء مواقع ويب جميلة في Dreamweaver
قم بتصميم مواقع الويب الديناميكية وبرمجتها وإدارتها في أداة قوية متكاملة.