| DivMan | 20.07.2016 20:10 |
Получилось спасибо))
DivMan,
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
.con{
position: absolute;
width: 100px;
height: 100px;
background: green;
}
</style>
<meta charset="utf-8">
</head>
<body>
<button id="btn">Создать div</button>
<script>var div2 = document.querySelector('.con')
function div(){
var div = document.createElement('div');
div.style.width='100px';
div.style.height='100px';
div.style.backgroundColor="green";
div.setAttribute('class', 'con');
document.body.insertBefore(div, document.body.firstChild);
div.addEventListener('mousedown', mDown);
div.addEventListener('mouseup', mUp);
}
btn.onclick = div
var activeElement;
var offsetX = 0;
var offsetY = 0;
var con = document.querySelector('.con');
var mDown = function(e){
console.log('Нажали кнопку мыши',e)
activeElement = e.target;
offsetX = e.offsetX
offsetY = e.offsetY
}
var mUp = function(e){
console.log('Отпустили кнопку мыши')
activeElement = null
}
var mMove = function(e){
//console.log('Двигаем курсор', e)
if(activeElement) {//если элемент есть, то есть на него нажали...
activeElement.style.top = (e.clientY - offsetY) + 'px'
//установить координату элементу top на текущее положение мышки
//минус смещение
//top от начала экрана до начала объекта
activeElement.style.left = (e.clientX - offsetX) + 'px'
}
}
/*
if(div2.classList.contains("con")){
alert('Блок создался')
}
con.addEventListener('mousedown', mDown);
con.addEventListener('mouseup', mUp);*/
document.addEventListener('mousemove', mMove);
</script>
</body>
</html>
|
Ебалайтен блин, все работает, вот так делается, то есть все что надо заранее определить - определяется, а потом уже выполняется.
var con=null,
activeElement,
offsetX = 0,
offsetY = 0,
mDown = function(e){
console.log('Нажали кнопку мыши',e)
activeElement = e.target;
offsetX = e.offsetX
offsetY = e.offsetY
},
mUp = function(e){
console.log('Отпустили кнопку мыши')
activeElement = null
},
mMove = function(e){
if(activeElement) {
activeElement.style.top = (e.clientY - offsetY) + 'px'
activeElement.style.left = (e.clientX - offsetX) + 'px'
}
};
function div(){
con=mk_div('con');
con.addEventListener('mousedown', mDown);
con.addEventListener('mouseup', mUp);
document.addEventListener('mousemove', mMove);
}
function mk_div(rule){
var div = document.createElement('div'),
style=div.style;
style.width='100px';
style.height='100px';
style.backgroundColor="green";
div.className=rule;
return document.body.insertBefore(div, document.body.firstChild)
}
btn.onclick = div;
|
рони,
Сотона опередил ))) |
Получилось спасибо))
|
| Часовой пояс GMT +3, время: 18:13. |