Я пытаюсь добиться наличия простых кнопок совместного доступа на стороне сообщения, которые видны только в том случае, если сообщение находится внутри представления. Поэтому они скрыты, если пользователь прокручивается выше или ниже этого сообщения.
jQuery waypoint это мое настоящее оружие выбора. Мой подход состоит из:
// first hiding the div
$('.post-sharing-side').hide();
// fading it in as soon as the headline reaches the top of the viewspace (that feels right in my use case)
$('.entry-title').waypoint(function(direction) {
$('.post-sharing-side').fadeIn();
});
// fading it out again as soon as the upcoming div reaches the bottom of the viewspace
MISSING
У меня возникли проблемы с выяснением последней части: исчезновение снова. В идеале он также должен работать при прокрутке вверх. Любые идеи были бы высоко оценены!
Обновить:
Извините, если я не был достаточно ясен: эффект, который я ищу, в основном этот бит без использования абсолютных значений.
Я решил это следующим образом, не используя в конечном итоге путевую точку jQuery:
$('.post-sharing-side').hide();
var entryheight = $('.entry-content').height();
$(document).scroll(function () {
var y = $(this).scrollTop();
if (y > 350 && y < entryheight) {
$('.post-sharing-side').fadeIn();
} else {
$('.post-sharing-side').fadeOut();
}
});
Из документации путевой точки по адресу http://imakewebthings.com/jquery-waypoints/#docs:
Вертикальные путевые точки также могут использовать значение "bottom-in-view". Это ярлык для общей функции, которая устанавливает путевую точку, когда нижняя часть элемента попадает в нижнюю часть окна просмотра.
$ ('. thing'). waypoint ({offset: 'bottom-in-view'});
Это может помочь.