خاصية القفز داخل الصفحات

jumping inside pages html
القفز داخل الصفحة : هو ببساطة الإنتقال من بداية الصفحة الى جزء في وسطها او نهايتها عبر رابط
مثال توضيحي لو ضغط على الرابط التالي سينقلك مباشرة الى نهاية الصفحة
(نهاية الصفحة)
بعد معاينتك للأمر نوضح بعض من استخدامات تلك الخاصية
من يكتبون مواضيع ضخمة ستكون مفيده لهم كثيراً حيث يمكنك تحديد جميع نقاط الموضوع في البداية كفهرس ومن يضغط على رابط نقطه ينتقل لها مباشرة تخيل كم المجهود الذي ستوفره على الزائر
 أيضاً من يصممون صفحات البيع او الهبوط سكويز بيج يمكنك عمل العديد من المميزات على صفحتك بهذه الخاصية
ننتقل لشرح الخاصية 
الخاصية لا تحتاج اى اكود ولا اى شئ يركب فقط بعض المعرفه بـ HTML وسنحاول تبسيط الامر قدر المستطاع
كل ما عليك فعله هو استخدام الكود التالي
<a href="#mo3arf">نهاية الصفحة</a>
 هذا الكود هو الرابط الذي عند الضغط عليه ينقلك للمنطقة التي تريد
كلمة نهاية الصفحة يمكنك ان تستبدلها بالكلمة التي تريد
ما يهمنا هو الكلمة التي بالأحمر 
انت ستضيف الكود السابق في الجزء الذي تريده في الصفحة بحيث عند الضغط على الكلمة الظاهر تنقلك لجزء آخر في الصفحة
كيف يتم ذلك عبر الكود التالي
<a name="mo3arf"></a>
لاحظ الكلمة الحمراء موجوده في هذا الكود ايضاً
ببساطة اكثر الكود الاول عند الضغط عليه ينقلك للكود الثاني
يعني لو اضفت الكود الأول في بداية الموضوع
واضفت الكود الثاني في نهايته سيتم نقلك لمنطقة الكود الثاني عند ضغطتك على منطقة الكود الأول
والعكس صحيح لو اضفت الكود الاول في النهاية والكود الثاني في البداية سينقلك للبداية التي بها الكود الثاني
سنعتبر ان الامر ممر بدايته الكود رقم واحد اينما كان مكانه في الصفحة
ونهايته الكود رقم اثنين اينما كان في الصفحة
ولو اردت تكرار الأمر كل ما عليك هو تكرار الأكواد مع تغيير الكلمة الحمراء
لاحظ الصورة التالية هي صورة الموضوع وانظر الى المثال الذي صنعته لك
اضغط على الصورة لتكبيرها

طبعا اضافة تلك الاكواد يكون عن طريق تحويل صندوق المواضيع من وضع التأليف الى وضع HTML
(العودة للبداية)
ملحوظة ان كانت الصفحة قصيرة ولا يوجد بها تمرير فلن يعمل لأن ببساطة الصفحة كاملة ظاهرة هذا يستخدم فقط مع الصفحات الطويلة
أيضاً اجعل تلك الأكواد هي آخر ما تضيفه في الصفحة لأنك لو أعدت الصفحة الى وضع التأليف قد لا تعمل معك يجب ان يكون حفظك في وضع HTML لضمان النجاح

No comments:

Post a Comment

201 تعريب عرب تيش جمياع الحقوق محفوظة 2016

Theme images by sndr. Powered by Blogger.