Офтоп
BlockRunet @Shara

Дилижанс: Навигация по непрочитанным комментариям

Хочешь, чтобы было хорошо — сделай себе хорошо сам. Делюсь маленьким скриптом, который добавляет кнопки для переключения между непрочитанными комментариями и позволяет переключаться между ними при помощи колеса мыши.

Сабж

Устанавливается скрипт при помощи плагина Greasemonkey/Tampermonkey или чего-то иного, что умеет делать инъекции пользовательских скриптов в странички.

В объекте options можно сделать настройки:

animate: true/false
Включение/выключение плавной прокрутки между комментами

animationSpeed: число в диапазоне 0 — +∞
Скорость плавной прокрутки между комментами в миллисекундах

circular: true/false
Включить/выключить навигацию по кругу

scrollOver: true/false
Включить/выключить переключение между комментами вращением колеса мыши, если курсор находится над кнопками навигации

position: число в диапазоне 0 — 100
В каком месте экрана должен находиться текущий просматриваемый комментарий.

Отсчёт координат ведётся от нижней границы экрана по двум причинам:
1. Видно сразу ветку комментов к которой принадлежит комментарий
~~~ 2. Кое-кто (не будем показывать пальцами) прихуярил к верхней границе экрана меню навигации поверх контента , благодаря чему навигация по якорям оказывается бесполезна чуть менее чем полностью.

UPD. Выяснилось, что теперь якори работают нормально.

Тестировал только в Firefox. Для комментов, подгруженных динамически не работает, так как кто-то (снова не будем показывать пальцами) сломал подсветку этих комментариев. Как починит - залью апдейт.

0
29 комментариев
Написать комментарий...
Невысокий Мика

Комментарий недоступен

Ответить
Развернуть ветку
Мужской Паша

А как раньше?

Ответить
Развернуть ветку
Рекламный татарин

Могу показать как сейчас

Ответить
Развернуть ветку
Невысокий Мика

Комментарий недоступен

Ответить
Развернуть ветку
Невысокий Мика

Комментарий недоступен

Ответить
Развернуть ветку
Горячий инструмент

Парни, вы же все одно коммунити. Я понимаю, что каждому хочется выпустить свой скрипт, но объединитесь и выпускайте релизы раз в неделю, презентуя их здесь. У меня сейчас стоит плагин от Поцелуева, который позволяет переходить к ответу на коммент, этот тоже хочу поставить. Было бы круто, если бы был один общий плагин с включающимися / отключающимися функциями.

Большое спасибо за все что вы делаете!

Ответить
Развернуть ветку
Рекламный татарин

Модульность рулит, зачем запихивать всё в один комбайн, если вместо функций в настройках можно подключать скрипты в настройках?

Ответить
Развернуть ветку
Горячий инструмент

Хрен знает... Видимо, у меня тяга к комбайнам и агрегаторам всего и вся :)

Ответить
Развернуть ветку
Закрытый Данила
у меня тяга к комбайнам

Белорус хули.

Ответить
Развернуть ветку
Цветной блик

Спасибо!

Ответить
Развернуть ветку
Серьезный пёс_анон

Комментарий недоступен

Ответить
Развернуть ветку
Рекламный татарин
.anchor

Если уж делать костыли, то с :target

Кстати, не понял какой магией, но сейчас якори на комментарии работают правильно, с отступом для плашки

Ответить
Развернуть ветку
Серьезный пёс_анон

Комментарий недоступен

Ответить
Развернуть ветку
Рекламный татарин

Кстати, на правах оффтопа в оффтопе - есть идеи как без использования JS реализовать удерживание скролла на якоре во время подгрузки изображений? А то бывает откроешь страничку на определённом коментарии, а потом гоняешься за ним пока картинки раскрываются.

С JS легко - отслеживаем изменение размера документа и переносим скролл обратно под якорь пока пользователь самостоятельно не прокрутит страничку. А вот без?

Ответить
Развернуть ветку
Серьезный пёс_анон

Комментарий недоступен

Ответить
Развернуть ветку
Серьезный пёс_анон

Комментарий недоступен

Ответить
Развернуть ветку
Рекламный татарин

У CSS действительно нет возможности отслеживать события такого уровня, а тем более выполнять какие-то функции вроде перехода.

Когда деревья были большими, а сайты не были резиновыми, можно было просто передать в тег img размеры изображения, чтобы зарезервировать под него место и избежать пересчёта страницы во время загрузки. Но когда высота изображения высчитывается на основании его ширины ничего подобного провернуть мы не можем, даже зная aspect ratio изображения. А может мы всётаки можем зарезезервировать место зная размеры изображения?

Вообще есть один вариант.. Можно указать в стилях для контейнера padding равный отношению высоты к ширине. Например для изображения 4:3 он будет равен 3/4*100 = 75%.

Набросал демку:
https://jsfiddle.net/7ptdtsy6/2/embedded/result,html,css,js/

Не самый красивый вариант, выглядит как хак. Есть идеи лучше?

Ответить
Развернуть ветку
Бешеный кавалер

На сайте уже какое-то время так и работает. По-моему, самый изящный способ в рамках css

Ответить
Развернуть ветку
Рекламный татарин

Оп, внезапно!

Ответить
Развернуть ветку
Рекламный татарин

Стоп, не везде - в теле поста ничего подобного нет.

Ответить
Развернуть ветку
Бешеный кавалер

А изображения в статье разве заставляют комментарии прыгать? Не вижу проблем даже с Good 2G и полусотней картинок. Единственная проблема на данный момент — загрузка твиттерских фреймов, если они есть на странице

Ответить
Развернуть ветку
Рекламный татарин

Не уверен, но хром похоже научился подруливать. По крайней мере даже с отключенным js скролл ползёт самостоятельно пока не покрутишь страницу — тогда с якоря срывается. С Firefox непонятки, нужно щупать, но в нём троттлинга нет, а без него цупать неудобно.

Ответить
Развернуть ветку
Рекламный татарин

Парсер, блжд!

Ответить
Развернуть ветку
Рекламный татарин

Если скорость интернета больше мегабита - нужно включить троттлинг.

Ответить
Развернуть ветку
Серьезный пёс_анон

Комментарий недоступен

Ответить
Развернуть ветку
Рекламный татарин

C :before вариант хуже, его нельзя задать в инлайновом стиле. Если у нас изображения строго определённых пропорций - можно завести 3-4 класса, а если какие-попало, загруженные пользователем, то смысла заводить файл стилей для них нет, лучше выдавать пропорциональный паддинг сразу по месту.

Ответить
Развернуть ветку
Обыкновенный калькулятор

Этого мало? Это же каскадные таблицы стилей, а не язык программирования + DOM. В CSS и так уже всякого напихали, что действительно скоро на них именно что программировать будут.

Я тоже такого решения на голых стилях не вижу, если только корявые весьма (но формально выполняющие "как без использования JS реализовать удерживание скролла на якоре во время подгрузки изображений").

Ответить
Развернуть ветку
Серьезный пёс_анон

Комментарий недоступен

Ответить
Развернуть ветку
Рекламный татарин

Когда я писал себе скрипт, при переходе по якорю панель закрывала часть коммента. Это было с месяц назад. Теперь там такая затычка

<a name="comment1235306"></a>

Со стилем

a[name*="comment"] {

display: block;
width: 100%;
height: 0;
position: absolute;
top: 0;
margin-top: -50px;
}

Так что теперь всё ок, можно вычеркнуть.

А вот подсветка не появляется или сразу пропадает после подгрузки новых комментариев. Надо посмотреть в чём дело.

Ответить
Развернуть ветку
Читать все 29 комментариев
null