2008-10-06 4 views
43

Мне нужно создать пользовательский слайдер тома для объекта WMP. Нынешний слайдер сложно модифицировать и использовать, есть ли простой способ генерировать слайдер на HTML-странице, которая может иметь значение, переданное функции javascript?Есть ли простой слайдер JavaScript?

+6

С HTML5 встроенные слайдеры можно объявить и стилизовать по CSS. `` Попробуйте! – 2012-06-25 18:52:30

+0

Но, к сожалению, в Firefox пока не работает :( – cprcrack 2012-10-25 17:22:29

+0

** ЗДЕСЬ !!!!!!!!!!!! ** - http://stackoverflow.com/questions/22904852/html-scroll-box-with -горизонтальные-управления-для-вертикальной прокрутки/ – 2014-06-11 17:06:01

ответ

19

HTML 5 с Webforms 2 обеспечивает <input type="range">, который сделает браузер генерировать родной ползунок для вас. К сожалению, у всех браузеров нет поддержки, но реализовал все элементы управления Webforms 2 с помощью js. IIRC js достаточно умен, чтобы знать, реализовал ли браузер этот элемент управления и запускается только в том случае, если нет встроенной реализации.

С моей точки зрения, следует считать лучшей практикой использовать встроенные средства управления браузерами, когда это возможно.

5

Вот еще один свет JavaScript Slider, который, как представляется, соответствует вашим потребностям.

10

JQuery и Yahoo, вероятно, стандарты, но я недавно нашел Dragdealer, который выглядит очень легкий и простой в установке и повторно кожи ...

http://code.ovidiu.ch/dragdealer/

34

эй я только что создал свой собственный движок JS, потому что у меня было достаточно тяжелой Jquery UI один. Заинтересован услышать мысли людей. Был на нем в течение 5 часов, так что действительно действительно ранние этапы.

jsfiddle_slider

-1

ниже код должен быть достаточно, чтобы вы начали. Протестировано в Opera, IE и Chrome.

<script> 
var l=0; 
function f(i){ 
im = 'i' + l; 
d=document.all[im]; 
d.height=99; 
document.all.f1.t1.value=i; 
im = 'i' + i; 
d=document.all[im]; 
d.height=1; 
l=i; 
} 
</script> 
<center> 
<form id='f1'> 
<input type=text value=0 id='t1'> 
</form> 
<script> 
for (i=0;i<=50;i++) 
{ 
s = "<img src='j.jpg' height=99 width=9 onMouseOver='f(" + i + ")' id='i" + i + "'>"; 
document.write(s); 
} 
</script> 
16

Простой слайдер: Я только что проверил это в чистом HTML5 и это так просто!

<input type="range"> 

Он работает как очарование на Chrome. Я еще не тестировал другие браузеры.