برمجة Smooth Scrolling بالجيكويري تأثير الصعود للاعلى او الاسفل

السلام عليكم ورحمة الله وبركاته


اليوم ساشرح لكم طريقة برمجة Smooth Scrolling بالجيكويري تأثير الصعود للاعلى او الاسفل.
توضيح اكثر .. يعني اذا كان لديك الكثير من ال div او الاقسام في موقعك وتريد الزائر عندما يضغط على رابط الdiv ينزل له بتاثير سلس وبسيط جدا
مثال :
<a href="#aboutus">About us</a>
هذا الوسم هو وسهم link في الــ HTML والرابط هو # عبارة عن هاش وبعده عنوان الــ id الخاص بقسم او div ومثال على ذلك :

<div id="aboutus">here content of this section</div>
اي بمعني انه اذا الزائر ضغط على اللنك سيوجهه الى الاسفل الى الــ div الخاص بـ About us

كود الــ Smooth Scrolling بالجيكويري :
$(function() {
  $('a[href*="#"]:not([href="#"])').click(function() {
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
      var target = $(this.hash);
      target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
      if (target.length) {
        $('html, body').animate({
          scrollTop: target.offset().top
        }, 1000);
        return false;
      }
    }
  });
});



الى هنا انتهى درسنا لهذا اليوم .. القاكم في درس قادم بأذن الله الى ذلك الين دمتم في رعاية الله احبائي .. لاتنسوا الضغط على لايك لصفحتي في الفيسبوك ليصلكم كل اخبار البرمجة والهاكرز والحماية وكل شي تقني انشاءالله وايضا شاركوا الموضووع للجميع ليستفيدوا منه لاتجعله يتوقف عندك اخي الجبيب ..



برمجة Smooth Scrolling بالجيكويري تأثير الصعود للاعلى او الاسفل برمجة Smooth Scrolling بالجيكويري تأثير الصعود للاعلى او الاسفل Reviewed by Munaf Aqeel Mahdi on 9:41 AM Rating: 5

No comments:

Powered by Blogger.