Comments 72
отличный плагин, вот только в опере 9.22 не пашет:-) а в мозилке 3+ пашет… это радует
И в Safari тоже.
тоже что? работает или нет? )
Уточните плз, а то нет возможности (и желания) проверить.
Уточните плз, а то нет возможности (и желания) проверить.
У меня в Safari на маке работает.
IE 7 (7.0.5730.13) — не работает. Строка 2705, символ 3: Объект не поддерживает этот метод или свойство.
Firefox 3.0.3 — работает. Opera 9.6 — работает. Safari 3.1.2 — работает. Google Chrome 0.2.149.30 — не работает. Всё на PC.
Firefox 3.0.3 — работает. Opera 9.6 — работает. Safari 3.1.2 — работает. Google Chrome 0.2.149.30 — не работает. Всё на PC.
в Сафари на Маке работает, но вид курсора как для ввода текста становится, не очень подходит…
ну и логически уменьшение-увеличение шрифта нужно поменять — по привычке увеличение идет по часовой стрелке ))
ну и логически уменьшение-увеличение шрифта нужно поменять — по привычке увеличение идет по часовой стрелке ))
Opera 9.6. Все отлично. Спасибо!
Тут на Mootools аналогичным способом (крутя стрелки) выбирается время: www.nogray.com/time_picker.php
Все хорошо, но его поведение «не адекватное», он не должен кидать значение из максимального в минимальное и обратно при прохождении нулевой позиции. Вы где-то видели такой регулятор громкости? Вот и я нет…
Вот Вам и домашнее задание :-)
может автор использовал плагин ссылку на который указал Vorchun… там часы тоже прокручиваются
задумка с реостатом хорошая, но надо еще доработать
задумка с реостатом хорошая, но надо еще доработать
Я в самом конце поста признался, что на этом работа не окончена и доработки еще будут. И этот момент также будет дорабатываться.
а вы с нуля делали или использовали какие-то чужие наработки?
С нуля. Вот почему-то взбрело в голову такое сделать. Просто раньше на JavaScript такого не видел. А Vorchun, как оказывается, видел =)
а мне кажется, что эта самая нулевая позиция должна быть внизу, в крайнем случае вверху, но никак не справа
можно на регулятор поставить ещё «cursor:pointer»
А если вы еще сделаете что бы он на скролл реагировал, вообще супер будет
думаю, было бы только плюсом, если по нажатии мышки на поле этого реостата, индикатор бы автоматом туда переезжал…
сейчас если только мышкой проведешь, то он переедет
сейчас если только мышкой проведешь, то он переедет
В музыкальных программах часто делают не так. В Guitar Rig, к примеру, после нажатия мышкой на регулятор, движение вниз уменьшает, а движение вверх — увеличивает значение. Так точнее получается имхо.
В плане точности — Вы можете отвести курсор при нажатой кнопке сколь угодно далеко и регулировать точнее.
Это зависит от того, как близко к краю экрана регулятор воткнут.
А мне вот у 3D Studio MAx нравилось — когда у числовых полей стрелки вверх-вниз разделялись строчкой, которую мышью можно было таскать вверх-вниз по экрану, меняя значение на больше-меньшее — так больше всего мне нравилось, что мышь в край экрана не упиралась, а сама перескакивала на другую сторону экрана и позволяла тянуть значение дальше!
Так вот и у таких крутилок — по кругу вокруг них мышь водить это конечно интуитивно, но вот вариант прямолинейного движения с максимальной точностью, но не ограниченный экраном бывает удобнее.
Хотя, для кругового движения по большому радиусу тоже можно попробовать экран замкнуть :) Не глядя на экран двигать будет удобно, а глядя после пары перескоков можно потерять направление. Хотя — это тоже вполне решается рисованием радиус-вектора от регулятора до мыши? с учётом всех перескоков… Но это уже наверно не Java-script
А мне вот у 3D Studio MAx нравилось — когда у числовых полей стрелки вверх-вниз разделялись строчкой, которую мышью можно было таскать вверх-вниз по экрану, меняя значение на больше-меньшее — так больше всего мне нравилось, что мышь в край экрана не упиралась, а сама перескакивала на другую сторону экрана и позволяла тянуть значение дальше!
Так вот и у таких крутилок — по кругу вокруг них мышь водить это конечно интуитивно, но вот вариант прямолинейного движения с максимальной точностью, но не ограниченный экраном бывает удобнее.
Хотя, для кругового движения по большому радиусу тоже можно попробовать экран замкнуть :) Не глядя на экран двигать будет удобно, а глядя после пары перескоков можно потерять направление. Хотя — это тоже вполне решается рисованием радиус-вектора от регулятора до мыши? с учётом всех перескоков… Но это уже наверно не Java-script
UFO just landed and posted this here
Всегда интересовал вопрос. Зачем нужен такой контрол в компьютерных интерфейсах? Не считая эстетического эффекта конечно.
в IE 7 не работает
Автор, спасибо за топик. На основе этого кода, те кому надо смогут понять как оно впринципе работает и применять там, где им нужно.
UFO just landed and posted this here
Я думал заменить абсолютное изменение угла на приращения. Ввести такую себе величину dφ и смотреть, в какую сторону мы крутим регулятор по знаку этой величины. Как только крутя в одну сторону мы заходим за заданную границу, скрипт это понимает и отказывается двигать регулятор дальше. Это пока только наброски в уме. На выходных допишу.
Зачет
Скрипт хорош.
Из возможных улучшений.
— еще не плохо, при вращении, отменить выделение текста.
— возможность поставить фокус и управлять стреклами
Но и без этого пригодиться
Из возможных улучшений.
— еще не плохо, при вращении, отменить выделение текста.
— возможность поставить фокус и управлять стреклами
Но и без этого пригодиться
Так вот зачем нужна математика! :)
Firefox 3.1a2 — работает, Opera 9.26 — работает, Safari 3.1.2 — работает
всё на маке
всё на маке
Скромно замечу, что вращательный регулятор на экране — очень неудобная штука. Потому что рука на мышке лежит так, что мышкой удобнее возить влево-вправо, а не по кругу. На физическом же устройстве крутить горизонтальный ползунок менее удобно, чем круглую ручку из-за того, что необходимо упереть кисть во что-нибудь для повышения точности настройки. Круглую ручку можно крутить двумя пальцами в то время, как кисть может висеть в воздухе.
Каждый элемент интерфейса выглядит так, как выглядит не потому, что у дизайнера в жопе зачесалось, а потому что так удобнее решать поставленную задачу в конкретных условиях.
Это я все к тому, что я не люблю неудобные глючные вертелки, а люблю удобные и неглючные. Не делайте так, как описано в этой статье.
Каждый элемент интерфейса выглядит так, как выглядит не потому, что у дизайнера в жопе зачесалось, а потому что так удобнее решать поставленную задачу в конкретных условиях.
Это я все к тому, что я не люблю неудобные глючные вертелки, а люблю удобные и неглючные. Не делайте так, как описано в этой статье.
А еще круглая ручка занимает меньше места.
я думаю что если такой регулятор крутить колесом мыши, то это удобно
с другой стороны почему тогда на микшерских пультах основная настройка, а именно громкость всегда выполняется в виде ползунка?
можно сказать конечно, что так более наглядно?
я бы сказал что если можно упереть руку то ползунок нагляден и удобен одновременно
с другой стороны почему тогда на микшерских пультах основная настройка, а именно громкость всегда выполняется в виде ползунка?
можно сказать конечно, что так более наглядно?
я бы сказал что если можно упереть руку то ползунок нагляден и удобен одновременно
Колесом мыши крутить, конечно, можно. Только оно крутится не в той плоскости, что ручка на экране, так что вариант не катит.
А вообще, единственный способ проверить удобство — сделать несколько вариантов и поиграться с ними на реальном макете. Всё остальное — домыслы. Неудобство любых круглых ручек в компьютерных интерфейсах я уже успел проверить на себе. Потому и предостерегаю модных джаваскриптеров от дурацкого времяпрепровождения.
А вообще, единственный способ проверить удобство — сделать несколько вариантов и поиграться с ними на реальном макете. Всё остальное — домыслы. Неудобство любых круглых ручек в компьютерных интерфейсах я уже успел проверить на себе. Потому и предостерегаю модных джаваскриптеров от дурацкого времяпрепровождения.
Просто пачка таких движков на пульте микшера существенно нагляднее — оно ж столбцовая диаграмма сам по себе. И там есть куда пальцам рядом с движком опереться, оно ж обычно более горизонтальное, так что помогая в одном, в другом не мешает.
Поддерживаю. Довелось мне тут недавно видеть такое решение в виде скина к аудиоплееру — неудобно! Так что не тратьте время зря.
я бы крутилку вешал не на 2 дива а на инпут. ну так, на всякий пожарный )
за такой пост можно и по карме плюсиком схлопотать… биг сенкс
А ещё можно сделать валкодер, как в радиопередатчике. Позволит быстро, удобно и точно подстроить частоту. Даже слишком большой динамический диапазон получается. Причём, чем больше разрешение экрана, тем больше точность…
Было бы замечательно, если бы узел тени был острее.
А не сделать бы Вам выбор цвета при помощи трех таких регуляторов?
А не сделать бы Вам выбор цвета при помощи трех таких регуляторов?
Думаю привычнее будет чтобы при вращение по часовой стрелке шрифт увеличивался, а не наоборот.
Как уже говорили:
Точку мин/макс вниз или вверх (отметить его как-то графически что-ли)
Убрать скачек в это точке (довольно легко делается на самом деле)
Курсор хорошо бы сделать «руку» при наведении и вращании
При зажатом Ctrl (Alt) сделать изменение по движению влево/вправо (вверх/вниз), для тех кому удобнее.
Изменение значения по колесику мышки (если скролла на странице нет естественно)
Про стрелки — спорно, лучше поставить рядом инпут и дать ввести число в этом случае.
А вращение по эллипсу было бы еще круче, ни к чему, но круто ;)
Точку мин/макс вниз или вверх (отметить его как-то графически что-ли)
Убрать скачек в это точке (довольно легко делается на самом деле)
Курсор хорошо бы сделать «руку» при наведении и вращании
При зажатом Ctrl (Alt) сделать изменение по движению влево/вправо (вверх/вниз), для тех кому удобнее.
Изменение значения по колесику мышки (если скролла на странице нет естественно)
Про стрелки — спорно, лучше поставить рядом инпут и дать ввести число в этом случае.
А вращение по эллипсу было бы еще круче, ни к чему, но круто ;)
в центре лучше сделать мертвую зону (круглую) иначе слишком большой диапазон приходится на слишком маленькую окружность и значение меняется резко и непредсказуемо
Вот это: var mouseTop = this.offset.y — e.client.y + containerPosition.y;
Следует заменить на: var mouseTop = this.offset.y — e.page.y + containerPosition.y;
А то скроллинг страницы не учитывался и крутилка вела себя неадекватно.
Следует заменить на: var mouseTop = this.offset.y — e.page.y + containerPosition.y;
А то скроллинг страницы не учитывался и крутилка вела себя неадекватно.
Не работает демка.
Sign up to leave a comment.
Делаем вращательный регулятор.