ФорумПрограммированиеJavaScript → Хочу двигать DIV мышкой

Хочу двигать DIV мышкой

  • md5

    Сообщения: 11960 Репутация: N Группа: в ухо

    Spritz Апрель 15, 2008, 12:58 п.п.

    хочу и все тут =)

    вобщем навыки имеются, но прежде чем начать
    хочу спросить совета чтоли кто делал

    логика примерно такая:
    ловим событие onmousedown… координаты мыши нужны, дива…
    дальше… надо ловить mouse move? или че? + смотреть чтобы на рамки окна не вываливался

    если всякие интересные плагины к прототайпу, но если они мне не нужны?
    все умрут, а я изумруд
  • AlexB

    Сообщения: 4306 Репутация: N Группа: в ухо

    Spritz Апрель 15, 2008, 1:06 п.п., спустя 8 минут 4 секунды

    Ну да mousemove, onmousedown и onmouseup.
    Я когда-то писал. Вот скрипт. Только он древний как гавно мамонта. Так что надо тестить и перерабатывать. Но за базовый можно принять:

    
    <div id="WIND" style="position:absolute; width:200px; height:200px; left:120px; top:120px; border : solid 1px red">
    Тест 
    </div>
    
    <script language="JavaScript1.2">
    // Зона за которую можно таскать
    var x = 0;
    var y = 0;
    var w = 100;
    var h = 100;
    
    document.onmousemove = MouseEvent;
    document.onmousedown = MousePress; 
    document.onmouseup = MouseUnPress;
    
    var browser = navigator.appName;
    var ver = parseInt(navigator.appVersion);
    
    if (browser != "Microsoft Internet Explorer")
    {
    	document.captureEvents(Event.MOUSEDOWN | Event.MOUSEUP);
    	document.captureEvents(Event.MOUSEMOVE);
    	obj = document.getElementById('WIND');
    }
    else
    {
    	document.onselectstart = checkEl;
    	document.ondragstart = checkEl;
    	obj = document.all.item('WIND');
    }
    
    function checkEl() 
    {
       return false;  
    }
    
    var pressflag = false;
    var oldcursx, oldcursy;
    var firstflag = true;
    var flag = false;
    
    function MouseEvent(ev) 
    {
    	windx = parseInt(obj.style.left);
    	windy = parseInt(obj.style.top);
    	cursx = (browser == "Microsoft Internet Explorer") ? event.clientX : ev.clientX;
    	cursy = (browser == "Microsoft Internet Explorer") ? event.clientY : ev.clientY;
    
    	if(firstflag)
    	{
    		oldcursx = cursx;
    		oldcursy = cursy;
    		firstflag = false;
    	}
    
    	if (flag) {
    		obj.style.left = windx + cursx - oldcursx;
    		obj.style.top =  windy + cursy - oldcursy;
    	}
    	oldcursx = cursx;
    	oldcursy = cursy;
    } 
    
    function MousePress()
    {
    	if ( (cursx > windx+x) && 
    		 (cursy > windy+y) &&
    		 (cursx < windx+x+w) &&
    		 (cursy < windy+y+h) )  
    	{
    		obj.style.cursor = "move";
    		flag = true;
    	}
    }
     
    function MouseUnPress()
    {
    	if (flag)
    	{
    		pressflag = flag = false;
    		obj.style.cursor = "auto";
    	}
    }
    </script>
    





  • md5

    Сообщения: 11960 Репутация: N Группа: в ухо

    Spritz Апрель 15, 2008, 1:11 п.п., спустя 5 минут 27 секунд

    интересно, посмотрю
    все умрут, а я изумруд
  • AlexB

    Сообщения: 4306 Репутация: N Группа: в ухо

    Spritz Апрель 15, 2008, 1:17 п.п., спустя 5 минут 58 секунд

    Если совсем грамотно подходить к вопросу, надо писать behavior для IE и XBL для Gecko.
    Чтоб одним классом задавать поведение диву. В общем копать и копать … ))
  • md5

    Сообщения: 11960 Репутация: N Группа: в ухо

    Spritz Апрель 15, 2008, 1:28 п.п., спустя 10 минут 47 секунд


    Если совсем грамотно подходить к вопросу, надо писать behavior для IE и XBL для Gecko.
    Чтоб одним классом задавать поведение диву. В общем копать и копать … ))
    ну вот, так всегда…
    все умрут, а я изумруд
  • DonDiego

    Сообщения: 27 Репутация: N Группа: Кто попало

    Spritz Авг. 18, 2012, 10:19 п.п., спустя 1586 дней 8 часов 51 минуту

    По деревне шли два деда,
    Толковали так и сяк,
    Один дед другого деда
    Хуем по хую хуяк!

Пожалуйста, авторизуйтесь, чтобы написать комментарий!