Здравствуйте Уважаемые Хелперы!
Делаю одну фичу с изображениями, но столкнулся с рядом проблем, помогите если можете, Пожалуйста.
Проще показать:
Наверняка сразу догадываетесь, что нужно:
Необходима возможность перетаскивать зеленое изображение например по диву только по горизонтали (x - ось), т.е. движений вверх быть не должно, при перетягивании изображение не должно выходить за границы дива, при перетаскивании до конца должна срабатывать ссылка, при отпускании в любой точке, кроме конца, изображение необходимо вернуть на изначальную позицию - влево.
Пробовал jQuery плагин Draggable Images - но этот плагин практически не подходит. вот его реализация
Лучшая и самую близкую реализацию, я нашел здесь - http://uppod.info/
и вот здесь: http://www.apple.com/ru/mac/
Вот эта вот полоса прокрутки.
Пожалуйста помогите - надежда осталась только на вас.
Вот нашел код один:
Code
<html>
<head>
<script language="JavaScript">
flg = (document.all) ? 0 : 1;
var obj;
function mousedown(ev)
{
if (flg)
{
obj = document.layers[ev.target.name];
X=ev.x;
return false;
}
else
{
obj = event.srcElement.parentElement.style;
X=event.offsetX;
}
}
function mousemove(ev)
{
if (obj)
{
if (flg)
{
obj.moveTo((ev.pageX-X));
}
else
{
obj.pixelLeft = event.clientX-X + document.body.scrollLeft;
return false;
}
}
}
function mouseup()
{
obj = null;
}
if (flg)
{
document.captureEvents(Event.MOUSEDOWN | Event.MOUSEMOVE | Event.MOUSEUP);
}
document.onmousedown = mousedown;
document.onmousemove = mousemove;
document.onmouseup = mouseup;
</script>
</head>
<body>
<div id="a" style="position:absolute;left:90;top:100;">
<img src="http://quby.ru/img/pers/answerbutton.png" name="a">
</div>
</body>
</html>
Пока работаю над ним, пока удалось только пускать кнопку по оси X, осталось ограничить ее движение на определенное количество пикселей, добавить ссылку при достижении конца, и возвращать назад при отпускании по пути следования. Но есть свои недостатки - кнопка может быть только абсолютна позиционированна 
