تمرير الشريط إلى مكان محدد في الصفحة بعد الضغط على رابط في HTML

الفكرة هي بإعطاء المكان (العنصر) الذي تريد الذهاب إليه id محدد ثم في الخاصية href لعنصر a تضع قيمة ذلك id مسبوقاً برمز #

مثال:

نضع للعُنصر الذي نريد التوجه له id:

<p id="target_paragraph">
  content
</p>

ثم في العُنصر a نضع:

<a href="#target_paragraph">Go To Paragraph</a>

و في الرابط التالي يُمكنك التجربة: هنا  

يمكنك الاسعانة بجافاسكربت ايضا لتطبيق ذات الفكرة. فعند الضغط على العنصر يتم الانزلاق الى عنصر ما.

نقوم بتحديد عنصر الرابط الفائق:

<a href="" class="home-link"> home </a>

var el = document.querySelector('.home-link');

ثم نسند الى حدث الضغط عليه حدث الانزلاق الى الحاوية المستهدفة. والتي هي الحاوية w في هاته الحالة:

el.addEventListener('click' , () => {
    document.querySelector(".w").scrollIntoView();
})