Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Posted by Konrad Pilch
Konrad Pilch
2,435 Points

What wrong did I do?

If you look at this, i want to make the sidebar fixed when touch the top. How can i do it/?

$(function () {
    var sidebar = $('.sidebar');
    var top = sidebar.offset().top - parseFloat(sidebar.css('margin-top'));

    $(window).scroll(function (event) {
      var y = $(this).scrollTop();
      if (y >= top) {
        sidebar.addClass('fixed');
      } else {
        sidebar.removeClass('fixed');
      }
    });
});
Konrad Pilch
Konrad Pilch
2,435 Points

Can someone explain the code as well please? more in depth.

Konrad Pilch
Konrad Pilch
2,435 Points

How does all this parse work, and the margin-top? why is that neeed? specifically hwhy margin top is needed ? please someone break that code up for me.

1 Answer

Konrad Pilch
Konrad Pilch
2,435 Points
Konrad Pilch
Konrad Pilch
2,435 Points

Ahh, i think i get it now.

So. We select sidebar and store in variable. Then we make a variable to get the sidebar top, var top, which we select the sidebar, offset and select the top of it .top(), now we get parseFloat to look for the floating number(i guess pixels or something, i guess parseFloat is looking when the margin-top will touch the top.

Now we select the window, whcih is the browser window, and on scroll, which is event, because scrolling is event, same a smoving the mouse is the event, we are preforming {

we create a var thats stoing window scrolling, touching top and now we are saying if the window top, is touching the top of the sidebar, we add to the sidebar class fixed, and if not we take it off.

I am correct?