Tôi biết tiêu đề hơi rối rắm, nhưng về cơ bản những gì tôi muốn làm được trình bày rõ ràng trên trang web này http://9gag.com cuộn xuống và chú ý đến thanh bên, có 2 quảng cáo sau khi quảng cáo thứ 2 đạt đến đầu trang. một trang.Làm thế nào để làm cho div cuộn xuống với một trang khi nó đạt đến đỉnh của trang?
Tôi muốn biết cách thực hiện việc này? html/css hoặc jQuery giải pháp được prefared.
Khi Kevin chỉ ra, điều bạn cần làm là nghe sự kiện scroll của tài liệu. Khi điều đó được kích hoạt, bạn sẽ muốn xem xét giá trị của scrollTop.
$(document).scroll(function() {
var useFixedSidebar = $(document).scrollTop() >= myThresholdValue;
$('.my-sidebar-items').toggleClass('fixed', useFixedSidebar);
});
Và CSS của bạn về cơ bản sẽ trông như thế này:
.my-sidebar-items.fixedSidebar { position: fixed; }
Một yếu tố phức tạp là có thể bạn sẽ muốn các mục cần được cố định ở mới, vị trí hàng đầu của họ, và bạn sẽ muốn làm một cái gì đó như thế này:
.my-sidebar-items.fixedSidebar { position: fixed; top: 0 }
Tuy nhiên, điều đó có thể sẽ chồng các mục của bạn lên nhau. Một giải pháp cho điều đó là đặt lớp fixedSidebar vào vùng chứa và sử dụng lớp như được mô tả.
Tôi sẽ thử ngay bây giờ thnx – Ilja
Bạn có thể sử dụng thanh dính http://archive.plugins.jquery.com/plugin-tags/sticky hoặc jQuery Waypoints http://imakewebthings.github.com/jquery-waypoints/
Cách đơn giản nhất là để lắng nghe sự kiện cuộn tag cơ thể, sau đó khi scrollTop được qua một số tiền nhất định, thêm một lớp học để các quảng cáo làm cho vị trí của nó được cố định, sau đó loại bỏ các lớp khi scrollTop được trở lại thấp hơn số tiền đó. Tôi không có mã để đăng dưới dạng mẫu nên tôi sẽ không đăng nó làm câu trả lời. –
@KevinB thnx, nhưng tôi không tốt với mã, vì vậy tôi sẽ prefare một mã, nhưng thnx cho một logic! – Ilja