Ισως θα εχετε δει σε μερικα site οταν κανουμε scroll καποιο div να μας ακολουθει. Παραδειγμα στο site της Apple το καλαθι αγορων μενει στην δεξια κορυφη καθολη την διαρκεια του scroll. Ο τροπος για να το επιτυχουμε ειναι πολυ απλος και μπορειτε να το εφαρμοσετε ευκολα στο δικο σας blog/eshop πχ για τις διαφημισεις του google Ads. Ας δουμε τον κωδικα και θα εξηγησω παρακατω πως δουλευει:
$(window).scroll(function () {
$("#scroll").stop().animate({ "margin-top": $(window).scrollTop() + "px" }, "fast");
});
Αφου εχουμε προσθεσει στην αρχη της σελιδας την jquery, τοτε αυτο που κανουμε ειναι, κατα τη διαρκεια του scroll event που λαμβανει μερος στο window object δημιουργουμε μια function στην οποια επιλεγουμε το div που θελουμε να μας ακολουθει και αρχικα του σταματαμε οποιο animation γινεται εκεινη τη στιγμη και επειτα ξεκιναμε ενα νεο animation μεσω της animate. Αυτο γινεται για τον λογο του συγχρονισμου. Στην animate που οπως βλεπεται την εχω βαλει σε σειρα επειτα απο το stop αλλαζω το περιθωριο του div απο την πανω πλευρα του window. Για να βρω την τιμη που πρεπει να εχει το νεο περιθωριο χρησιμοιω την .scrollTop() η οποια μας επιστρεφει το position του scroll bar του αντικειμενου που εχουμε επιλεξει. Στην προκειμενη περιπτωση του div.
Αναλυτικοτερα για διαβαστε, .scrollTop(),