Как мышкой перемещать Div блок?

[hogart]

Simon, в IE нельзя сделать так, чтобы перемещаемый элемент был выше селектов, радио-баттонов и т.п.
Дело в том, что эти элементы рисуются IE системными средствами и после всего остального.
Насчет фреймов — не уверен.

Либо забить, либо реализовать свой селект

[Simon]

hogart,сделать можно, но как правильно не получается. Делается это через фреймы, когда я делал, фрэйм перекрывает основной блок, и взяться уже за перемещаемый блок нельзя(поскольку фрейм заполнил всю часть перемещаемого блока), но селект(список) в это время спрятан за перемещаемый блок.
А можно ли както средствами ява скрипта сделать, ну тоже чтобы компактно и не не большой код был?

[hogart]

Simon, перетаскивайте блок, который почти весь состоит из фрейма. *пожимает плечами* Как-то так, наверное…

[Stern87]

Код linbis очень сильно помог. Слегка доработав получил именно то, что нужно!
Спасибо!

[Simon]

Stern87, класно, подскажи если есть возможность как доработал?

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

[Stern87]

Доработанный пример в работе

[bugmenot]

function $(v) { return(document.getElementById(v)); }
function agent(v) { return(Math.max(navigator.userAgent.toLowerCase().indexOf(v),0)); }
function xy(e,v) { return(v?(agent('msie')?event.clientY+document.body.scrollTop:e.pageY):(agent('msie')?event.clientX+document.body.scrollTop:e.pageX)); }

function dragOBJ(d,e) {

    function drag(e) { if(!stop) { d.style.top=(tX=xy(e,1)+oY-eY+'px'); d.style.left=(tY=xy(e)+oX-eX+'px'); } }

    var oX=parseInt(d.style.left),oY=parseInt(d.style.top),eX=xy(e),eY=xy(e,1),tX,tY,stop;

    document.onmousemove=drag; document.onmouseup=function(){ stop=1; document.onmousemove=''; document.onmouseup=''; };

}

А как можно сделать чтобы DIV перемещался только внутри выделенной области? А то так он по всей странице свободно перемещается.

[mycrashedmind]

попроще и с jquery

var mouse_event = 0
				var differenceX = 0
				var differenceY = 0
				$('#dialog_title').mousedown(function(e){
					differenceX = e.pageX-parseInt($('#dialog').css('left'))
					differenceY = e.pageY-parseInt($('#dialog').css('top'))
					mouse_event=1
				})
				document.onmouseup = function(){
					mouse_event = 0
				}
				document.onmousemove = function(e){
					if (mouse_event == 1){
						$('#dialog').css('left',e.pageX-differenceX)
						$('#dialog').css('top',e.pageY-differenceY)
					}
				}

<div id="dialog">
<div id="dialog_title">Title<spa id="dialog_close" style="position:absolute;right:5px;top:3px;cursor: hand;"></span></div>
<div id="dialog_content"></div>
</div>

[MartbIshka]

Спасибо за полезный скрипт. Добавила вместо position:relative position:fixed и блок стал перемещаться при прокрутке(удобно не нужно его вниз страницы самому тащить).

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

[Deself]

А как сделать чтобы при достижении определёных координат блок останавливался?