KnowledgeHub
Questions
Tags
Users
Search
Alex Rivera
|
Logout
Edit Question
Title
Body
Hi Developers all over the world. I would like to have some help with a simple, pure Javascript (30 lines) , JQuery free (and other library's) drag control slider. I have been searching months and found many scripts but i don't like -Jquery cause most script need 4, 5, 6 javascript includes.. I prefer smaller and basic script.. i like to ajust them like i want and i also can lean alot from smaller scripts. All i need is a simple slider that i can use for: rescale images, scroll page, change brightness on images (with PHP) etc. I am new with javascript (2 months) , this is how far i get now.. Sorry for the bad variable names... <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> i appriciate your help. I wrote this on 31 december 2012.. So happy new year. Please be good for each other. Thank you.
Tags (comma-separated)
Save Edits
Cancel