دورة احتراف البلوجر والربح منها | الدرس الثاني عشر : شرح الحصول اضافة زر الصعود و الهبوط في المدونة

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

اولا : نبحث عن  </b:skin>

ونضع هذا الكود فوقه

/* START CSS The "go to top" and "go to bottom" links.by:www.princeinfor.ga */

#toplink, #botlink { position: fixed; right: 7.5%; bottom: 50%; padding: 11px 9px 11px 11px; margin: 0 -20px 0 0; color: #666; font-size: 1.5em;

background: #f0f0f0 url(images/Standard/catbg.gif) 0 5px repeat-x; border: 1px solid #b4b4b4; border-bottom: 1px solid #b8b8b8; border-radius: 6px 3px 0 0; z-index: 99;

box-shadow: 1px 2px 3px rgba(0,0,0,0.25); }

#botlink { top: 50%; padding: 10px 9px 11px 11px; bottom: auto; border: 1px solid #b4b4b4; border-top: 1px solid #ddd; border-radius: 0 0 3px 6px;}

#toplink:hover, #botlink:hover { color: #a52311; background: #fcfcfc; text-decoration: none; }

/* END CSS The "go to top" and "go to bottom" links.by:www.princeinfor.ga */

ثانياً : نبحث عن </head>

ونضع هذا الكود فوقه

<script type='text/javascript'>

// Begin jQuery section.BY www.princeinfor.ga

   $.fn.ready(function() {

    // Smooth scroll to top.

    $("a[href=#top]").live("click", function(e) {

     $("html,body").animate({scrollTop:0}, 1000);

     e.preventDefault();

    });

    // Smooth scroll to bottom.

    $("a[href=#bot]").live("click", function(e) {

     $("html,body").animate({scrollTop:$(document).height()}, 1000);

     e.preventDefault();

    });

});

  </script>

ثالثاً : نبحث عن </body>

ونضع هذ االكود فوقه 

<!-- START HTML The "go to top" and "go to bottom" links.by:www.princeinfor.ga -->

<a href="#top" id="toplink" title="Go to top">↑</a>

<a href="#bot" id="botlink" title="Go to bottom">↓</a>';  

• غرّد
• شارك
• شارك
• شارك
• شارك