jQuery scroll plugin
Нашел в понедельник плагин для mootools который заменяет обычную полосу прокрутки. Очень понравилась идея, и очень не понравилась реализация, ОЧЕНЬ много кода у чувака вышло на какой-то скроллинг. У меня был махонький опыт работы со скроллингом в плагине автокомплит и я решил переписать все с нуля на jQuery.
Идея была хорошая, реализация - гавно. Сидел писал... Разруливал грабли.
Началось все с чертовой верстки, ее как обычно не понял IE, но там особых проблем не возникло, кое-что через скрипт поправил.
Первой неприятной граблей было отсутствие в jQuery поддержки колесика мишки, но плагин на этот случай нашелся очень быстро. Обожаю jQuery за огромное количество плагинов! И не смотря на то что плагин небольшой это уже давало лишний код и лишнюю зависимость для моего плагина. Не айс :(
Второй граблей стал ползунок, на него надо было натянуть drag. Тоесть перетаскивание, писать самому этот гемор я не решился, мне не настолько не хуй делать. Откуда взять драг? Правильно из jQuery UI. Примастырил я его довольно легко, благо там все просто. Оказалось еще два дополнительных файла (core и draggable) и килобайты лишнего кода. Мне это очень не понравилось, но ничего поделать я не мог.
Этот же ползунок надо было перемещать под мышку при клике на полоску прокрутки. Как мудак, почти целый день втыкал в формулу зависимости высоты ползунка от длинны текста, координат ползунка на полосе прокрутки и пытался сместить его на половину его высоты вверх чтобы он попадал на мышку центром. Потом только понял что то координата ползунка не зависит от длины полоски и ничего смещать не надо, она зависит от места куда кликнули. Как тока понял все быстро срослось. О чем я написал прошлую заметку
Ок, ползунок стал куда ему требовалось теперь надо было из скрипта активировать событие drag. Поначалу даже не знал с чего начать, пробовал вызывать события mousedown и mousemove по очереди, потом вызвать их оба сразу, никаких результатов. Полез в код UI разбираться. От туда как-то вытащил событие "mousedown.draggable", попытался его вызвать через trigger, получил ошибку о зациклившейся рекурсии. Долго ругался. Гуглил. Узнал что так можно было делать еще в версии 1.5.3, а теперь это перекрыли. Авторы советуют использовать плагин симуляции пользователя. Долго ругался на дополнительный код, хотел из него что-то удалить, плюнул, поставил. Ура! Заработало. Потом уже во время написания статьи и проверки в IE и других браузерах оказалось что работает этот чудо-плагин тока в FireFox'e. Н у и хуй с ним, всеравно в оригинальном плагине так не работало.
Пока гуглил решение проблемы с drag'ом нашел плагин который реализовывает этот же функционал и вроде как гибче в настройках. Поставил, легче не стало, зато кода вроде уменьшилось и не надо использовать весь UI. В общем оставил в коде закомментированным кусок для подключения плагина. кто хочет может ебаться.
Так я похоже уже всех замариновал пиздежом не по теме. Выкладываю рабочий пример. Цацкайтесь.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut id eros eget dui tincidunt aliquam. Nulla mollis, erat suscipit pellentesque bibendum, nulla risus ultrices tellus, laoreet lobortis libero urna sit amet sem. Nunc placerat augue in felis condimentum fringilla. Mauris in sapien quis dolor sagittis pretium sit amet quis ante. Suspendisse elit arcu, pellentesque eget suscipit et, pharetra sit amet massa. Integer ut tortor sed tortor accumsan venenatis quis a ipsum. Aliquam erat volutpat. Mauris varius tincidunt tortor, sed feugiat enim lobortis eu. Aenean vitae metus augue, vel auctor mi. Cras sapien augue, interdum dignissim eleifend vel, porttitor eget ante. Cras feugiat varius ante, vel tincidunt quam congue ac. Aenean id purus nec diam sodales dignissim sit amet id turpis. Curabitur dignissim tincidunt euismod. Fusce euismod iaculis placerat. Donec consectetur ultrices semper. Pellentesque tellus ipsum, ultricies at fermentum sit amet, volutpat sit amet libero. Curabitur id lacus ipsum. Aliquam vulputate, est in mattis porttitor, lectus ante blandit turpis, vitae luctus felis purus vel libero.
Nulla velit augue, rutrum eu egestas rhoncus, aliquam at ante. Ut in dolor non orci malesuada commodo vitae non sem. Vestibulum quis neque ut massa tempus aliquet. Sed congue est sed arcu molestie consequat. Aenean eget dapibus lorem. Suspendisse tempor sem sit amet urna fermentum nec aliquam massa aliquet. Curabitur quis risus non est tincidunt congue id in neque. Nulla vel lorem ipsum. Nullam laoreet odio id nibh molestie sagittis eu ut ipsum. Donec ut risus vitae ante gravida lacinia. Integer quis enim massa. Donec ligula arcu, facilisis eget scelerisque et, dapibus non turpis. Maecenas quis orci tortor, sit amet porttitor leo.
Donec ullamcorper nisl dapibus mi semper non congue nunc luctus. Curabitur vitae erat neque, sed tincidunt arcu. Donec sodales rhoncus lectus et condimentum. Etiam dignissim odio a diam luctus congue. Nam vel tortor odio. Ut eu rutrum nibh. Pellentesque urna velit, laoreet quis semper eget, tempus non urna. Nam commodo turpis eget diam suscipit eget pulvinar diam auctor. Maecenas eu velit facilisis velit convallis vehicula vel sed nibh. Vivamus at ultricies justo. Ut eleifend libero eget leo varius sed aliquam turpis semper. Praesent dui sem, suscipit vel convallis et, pretium at dolor. Maecenas mollis pharetra metus, tempus luctus lacus tristique sit amet. Donec scelerisque ultrices varius.
Будет настроение буду доделывать... Уберу чертов плагин симуляции, всеравно не пашет... Потом там есть бага, когда сначала кликнул на полосу прокрутки, а потом на стрелку вверх, ползунок чуть вниз зъезжает. Посмотрим может не лень будет.
Добавлено 04.06.09 в 2 ночи. После 2 часов дебага обнаружил что плагин симуляции пользователя корректно работает только если виджет расположен на первом экране, то есть сама страницы с виждетом не проскроллена. После чего все воспоминания про плагин были выкинуты из кода. Застрелите меня.
Добавлено 05.06.09 в 12 ночи. Наконец-то доделал. Теперь скроллинг полностью имитирует поведение виндового скроллинга. И его можно применять не только к отдельному элементу но и ко всей странице.
jQuery().ready(function($) {
$().jscroll(); // document
});
Размер моего плагина (не сжатым) 6 424 байт, а размер оригинального 23 076. При этом размер всех подключаемых js файлов (сжатых) у jquery 91 725, а у mootools 96 157 байт.
Добавлено 06.06.09 в 20:00. Добавлена поддержка IE 7 & 8. В IE 6 неправильно возвращается свойство scrollHeight, поэтому скроллинг глючит.
Скачать сие чудо с примерами работы можно отсюда DOWNLOAD LINK
Свежие комментарии