Prosty suwak kontrolera przeciągania Javascript
Cześć Deweloperzy na całym świecie.
Chciałbym uzyskać pomoc w prostym, czystym Javascript(30 linii), JQuery za darmo(i inne biblioteki) suwak sterowania przeciąganiem.
Szukałem miesięcy i znalazłem wiele skryptów, ale nie lubię -Jquery powodują, że większość skryptów wymaga 4, 5, 6 javascript obejmuje .. Wolę mniejszy i podstawowy skrypt .. lubię je dostosowywać, jak chcę, a także mogę chudego dużo z mniejszych skryptów.
Wszystko, czego potrzebuję, to prosty suwak, którego mogę użyć do: skalowania obrazów, przewijania strony, zmiany jasności na obrazach(z PHP) itp.
Jestem nowy z javascript(2 miesiące), oto jak daleko mam teraz ... Przepraszam za złe nazwy zmiennych ...
<script type="text/javascript">
_item = null;
mouse_x = 0;
drag_x = 0;
function move_init() {
document.onmousemove = _move;
document.onmouseup = _stop;
}
function _stop(){
_item = null;
}
function _move(e){
mouse_x = document.all ? window.event.clientX : e.pageX;
if(_item != null){
_item.style.left = (mouse_x - drag_x) + "px";
}
}
function _move_item(drag)
{
_item = drag;
drag_x = mouse_x - _item.offsetLeft;
}
move_init();
drag.onmousedown=_move_item(); // Agh.. did'nt figure out how this works
</script>
<style type="text/css">
#drag{background:#797979;color:#fff;width:30px;height:15px;position:relative;}
#track{background:red; width:200px;}
</style>
<div id="track"><div id="drag" onmousedown="_move_item(this);" >x</div></div>
aprobuję twoją pomoc.
Napisałem to 31 grudnia 2012 roku. Tak szczęśliwego nowego roku. Proszę, bądźcie dla siebie dobrzy.
Dziękuję Ci.