I am making a horizontal scroll website I have a fixed menu but I want the home button to be get fixed when I get close to it I hope someone understands Idk how to explain it. Here is my code it works on the Y-axis but not on the X-axis.

$(document).scroll(function() {
var x = $(document).scrollTop(), //get page x value 
    header = $("#home");
if(x >= 100)  {
    header.css({position: "fixed", "top" : "0", "left" : "0"});
} else {
    header.css("position", "relative");
}

});