Превратить input type button в ползунок
Здравствуйте, у меня вот такая проблема. Я нашел очень неплохой плеер (главное простой) ссылка и примеил его на своем сайте. Там управление плеером через яваскрипт (onclick события). Так вот неустраивает лишь один минус там уровни громкости описаны в виде кнопок input, я вот хочу чтобы это был ползунок. Но за неимением знаний по js незнаю как это сделать. Я ваще в js ноль. Помогите пожалуйста справится с задачей. У меня сайт сам на Jquery в основном работает чтоб и конфликтов небыло бы. Заране спасибо всем кто ответит. Жду.
|
Есть замечательный html-элемент:
<input type="range" min="0" max="100" value="100" id="volume" oninput="this.labels[0].textContent = this.value" onchange="this.oninput()" /> <label for="volume">100</label> Однако он из HTML5 и не поддерживается старыми браузерами (плюс со стилизацией проблема). Если это проблема, то можно подключить например такую штуку: http://refreshless.com/nouislider/ или jquery.ui |
где найти информацию по
Цитата:
|
whatwg.org - там всё должно быть. Mozilla Developer Network - тоже полезный ресурс. Ищи сам в общем.
|
Цитата:
onclick="uppodSend('player','v50')" и как <input type="range" min="0" max="100" value="100" id="volume" oninput="this.labels[0].textContent = this.value" onchange="this.oninput()" onclick="uppodSend('player','v100')" /> <label for="volume">100</label>Так? |
Дык не по клику должна громкость меняться а по изменению значения (onchange). Но в большинстве браузеров onchange событие происходит только когда отпускаешь ползунок. Зато срабатывает oninput. Так что вешать надо на onchange , а на oninput вызывать вручную через вызов this.onchange(). Ну или наоборот (как в примере у меня).
|
то что в онклике было нужно в один их этих параметров засунуть?
|
danik.js,
вы то сами как узнали что есть this.labels? или это только для Google Chrome |
рони, ты прав. Это HTML5 фича, реализована только в хроме и старой опере.
Спецификация http://www.whatwg.org/specs/web-apps...dom-lfe-labels Баг на багтреккере файрфокса: https://bugzilla.mozilla.org/show_bug.cgi?id=556743 |
Цитата:
|
Часовой пояс GMT +3, время: 21:39. |