Реализовать окна сделанные на блоках div

@slenderface · Регистрация: 24.03.2014

Author24 — интернет-сервис помощи студентам

необходимо реализовать окна. вот то что у меня уже есть

CSS

body, html { 
margin:0px;overflow:hidden;
background:URL(src/bg/default.jpg);
background-repeat:no-repeat;background-size:100%;
} 
.my-panel {
display:block;position:absolute;border-top:2px solid #480048;
bottom:0px;width:100%;height:42px;
background:URL(src/textr/panel.jpg);
opacity: 0.9;z-index:5;
}
 
 
 
.window-view {
display:block;position: absolute;
height:380px;width:650px;background: rgba(255, 255, 255, 0.5);
border:1px solid #0BB;border-radius: 10px 10px 0px 0px;
 
}
.window-view-title {
width:100%;background-color:#A5C9EF;font-size:larger;
border-radius: 10px 10px 0px 0px;color:#FFF;font-weight:bold;
cursor:pointer;height:30px;line-height:30px;opacity:0.7;
}
.window-view-btn-exit {
 border-radius: 0px 10px 0px 0px;width:30px;float:right;
 height:30px;background-color:#C90000;
 margin: 0 auto; display: table-cell;vertical-align: middle;
 
} 
.window-view-btn-exit:hover { background-color:#940000; }

HTML5

<?php
 
?>
 
<html>
<head>
<link rel="stylesheet" type="text/css" href="main.css">
<script type="text/javascript" src="scripts/main.js"></script>
<title></title>
</head>
<body>
<div class="my-panel">
<div>
 
</div>
</div>
 
<div class="window-view" id="Window">
<div class="window-view-title" onmousedown="javascript:mouseDown(this, event);">
<span style="margin-left:10px;position:relative;">Заголовок окна</span>
<div class="window-view-btn-exit"><img src="src/img/close.png" style="width:28px;height:28px;vertical-align:middle;display:inline-block;" alt=""></div></div>
<iframe src="" frameborder="0" style="height:350px;width:100%;position:relative;"></iframe>
</div>
</body>
</html>

Javascript

var dragObject;
    var offsetX, offsetY;
    var isDragging = false;
 
    window.onload = init;
 
    document.onmousemove = mouseMove;
    document.onmouseup = mouseUp;
 
    function init() {
      var o = document.getElementByClassName("window-view");
      o.ondrag = function() { return false; };
      o.onselectstart = function() { return false; };
      o.style.left = "100px";
      o.style.top = "100px";
      o.style.display = "block";
    }
 
    function mouseDown(o, e) {
    var o = document.getElementByClassName("window-view");
      dragObject = o;
      if(window.event) e = window.event;
      var oX = parseInt(dragObject.style.left);
      var oY = parseInt(dragObject.style.top);
      var mouseX = e.clientX;
      var mouseY = e.clientY;
      offsetX = mouseX - oX;
      offsetY = mouseY - oY;
      isDragging = true;
      return false;
    }
 
    function mouseMove(e) {
    var o = document.getElementByClassName("window-view");
      if(!isDragging) return;
      if(window.event) e = window.event;
      var mouseX = e.clientX;
      var mouseY = e.clientY;
      var newX = mouseX - offsetX;
      var newY = mouseY - offsetY;
      dragObject.style.left = newX + "px";
      dragObject.style.top = newY + "px";
      return false;
    }
 
    function mouseUp() {
   var o = document.getElementByClassName("window-view");
      if(!isDragging) return;
      isDragging = false;
      return false;
    }

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

@kalabuni · 16.04.2015, 10:27

Сообщение от slenderface

Проблема в том, что скрипт работает по id

в вашем HTML-коде имеется всего один id="Window"?
при этом в вашем скрипте нет ни одного вызова метода getElementById ('Window')

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

@slenderface · 16.04.2015, 10:54 **[ТС]**

Сообщение от kalabuni

в вашем HTML-коде имеется всего один id="Window"?
при этом в вашем скрипте нет ни одного вызова метода getElementById ('Window')

простите, немного не то код дал - это наработки.
вот оригинал:

Javascript

var dragObject;
    var offsetX, offsetY;
    var isDragging = false;
 
    window.onload = init;
 
    document.onmousemove = mouseMove;
    document.onmouseup = mouseUp;
 
    function init() {
      var o = document.getElementById("Window");
      o.ondrag = function() { return false; };
      o.onselectstart = function() { return false; };
      o.style.left = "100px";
      o.style.top = "100px";
      o.style.display = "block";
    }
 
    function mouseDown(o, e) {
    var o = document.getElementById("Window");
      dragObject = o;
      if(window.event) e = window.event;
      var oX = parseInt(dragObject.style.left);
      var oY = parseInt(dragObject.style.top);
      var mouseX = e.clientX;
      var mouseY = e.clientY;
      offsetX = mouseX - oX;
      offsetY = mouseY - oY;
      isDragging = true;
      return false;
    }
 
    function mouseMove(e) {
    var o = document.getElementById("Window");
      if(!isDragging) return;
      if(window.event) e = window.event;
      var mouseX = e.clientX;
      var mouseY = e.clientY;
      var newX = mouseX - offsetX;
      var newY = mouseY - offsetY;
      dragObject.style.left = newX + "px";
      dragObject.style.top = newY + "px";
      return false;
    }
 
    function mouseUp() {
   var o = document.getElementById("Window");
      if(!isDragging) return;
      isDragging = false;
      return false;
    }

@BANO · 16.04.2015, 16:09

ну можно сделать всё по атрибутам этого дива, и использовать классы для определения что это за див(окно или нет)

Javascript

 
    window.onload = init;
 
    //document.onmousemove = mouseMove;
    //document.onmouseup = mouseUp;
 
    function init() {
      document.getElementsByClassName("window").forEach(function (e){
          // tut budem davat nujnue funkcii
        e.ondrag = function() { return false; };
        e.onselectstart = function() { return false; };
        e.onmousedown=mouseDown;
        e.onmouseup=mouseUp;
        e.onmousemove=mouseMove;
        e.style.left = "100px";
        e.style.top = "100px";
        e.style.display = "block";
      });
      var o = document.getElementById("Window");
    }
 
    function mouseDown(e) {
      e = e|| window.event;
      o = e.target;
      var oX = parseInt(o.style.left);
      var oY = parseInt(o.style.top);
      var mouseX = e.clientX;
      var mouseY = e.clientY;
      o.setAttribute("offsetX",mouseX - oX);
      o.setAttribute("offsetY", mouseY - oY);
      isDragging = true;
      return false;
    }
 
    function mouseMove(e) {
      e=e||window.event;
    var o = e.target;
      if(o.getAttribute("draging")!="y") return;
      var mouseX = e.clientX;
      var mouseY = e.clientY;
      var newX = mouseX - (+o.getAttribute("offsetX"));
      var newY = mouseY - (+o.getAttribute("offsetY"));
      dragObject.style.left = newX + "px";
      dragObject.style.top = newY + "px";
      return false;
    }
 
    function mouseUp(e) {
   var o = (e||window.event).target;
      //if(!isDragging) return;
      o.setAttribute("draging", "n");
      return false;
    }

@slenderface · 16.04.2015, 17:11 **[ТС]**

BANO, огромное спасибо, но теперь по чему то вообще ничего не работает

@BANO · 16.04.2015, 17:22

там работает только на классах, а не на ид

Добавлено через 49 секунд
но может вообще не работать(я не проверял

)

@slenderface · 16.04.2015, 17:51 **[ТС]**

Сообщение от BANO

но может вообще не работать(я не проверял)

ясненько
и как быть?

Добавлено через 1 минуту

Сообщение от BANO

сделать всё по атрибутам этого дива,

это div-у где-то прописывать?

@BANO · 16.04.2015, 20:51

на самом деле всё проще
ты должен поствить тому div не id а класс "window", и вообще всем дивам которые должны быть окнами
я точил код именно под класс, а атрибуты нужны вместо переменных типо offset или dragobject что делает мой скрипт не зависимым от количества этих "окон"

@slenderface · 17.04.2015, 14:15 **[ТС]**

BANO, я так и сделал, но всё равно не хочет.

Вероятно что он даже этот класс не находит, т.к. даже этот скрипт не как на него не влияет:

Javascript

    var dragObject;
    var offsetX, offsetY;
    var isDragging = false;
 
    window.onload = init;
 
    document.onmousemove = mouseMove;
    document.onmouseup = mouseUp;
 
    function init() {
      var o = document.getElementsByClassName("window_view");
      o.ondrag = function() { return false; };
      o.onselectstart = function() { return false; };
      o.style.left = "100px";
      o.style.top = "100px";
      o.style.display = "block";
    }
 
    function mouseDown(o, e) {
    var o = document.getElementsByClassName("window_view");
      dragObject = o;
      if(window.event) e = window.event;
      var oX = parseInt(dragObject.style.left);
      var oY = parseInt(dragObject.style.top);
      var mouseX = e.clientX;
      var mouseY = e.clientY;
      offsetX = mouseX - oX;
      offsetY = mouseY - oY;
      isDragging = true;
      return false;
    }
 
    function mouseMove(e) {
    var o = document.getElementsByClassName("window_view");
      if(!isDragging) return;
      if(window.event) e = window.event;
      var mouseX = e.clientX;
      var mouseY = e.clientY;
      var newX = mouseX - offsetX;
      var newY = mouseY - offsetY;
      dragObject.style.left = newX + "px";
      dragObject.style.top = newY + "px";
      return false;
    }
 
    function mouseUp() {
   var o = document.getElementsByClassName("window_view");
      if(!isDragging) return;
      isDragging = false;
      return false;
    }

+ может не правильно элемент класса вызывается?

Javascript

//Вы так вызываете = множественное число
document.getElementsByClassName("window_view");
//я ещё так пробовал
document.getElementByClassName("window_view"); 
//и даже так:
document.getElementByClass("window_view");

@BANO · 17.04.2015, 19:28

я вызываю, он возвращает массив, а у вас он возвратит только ошибку
а на самом деле ща я шву запущю и проверю свой код "на вшивость"

Добавлено через 5 минут
прикол в том, что я запускаю функцию init после загрузки страницы, как и вы, но я беру массив элементов с классом window и перебираю с помощью foreach(добавляю каждому функции onmousedown и т.п.)
а в mousedown, как и в других функциях управляющих "окошками", я беру event? в котором хранится target-цель- элемент к которому был привязан event

вы пытаетесь оставить свой код максимально без изменений), дело ваше но там точно будут ошибки из-за неправильного использования методов getElemen...

Добавлено через 55 минут
нашёл ещё одну вещь - вы поставили атрибут onmousemove, что мешало работать
но я тоже лохонулся- target элемент на который вызван event, и он может быть чем угодно хоть window-view-title(что меня бесило) хоть document

и я нашёл баг при слишком быстром движении мыши уже опускай, не опускай, а окно будет двигаться за курсором, я это исправил путём пере направления события onmouseout на вашу функцию mouseUp)

и ещё getElementsByClassName не работает forEach(для меня это стало большим обломом) пришлось заменить его на for..in и всё пошло), ща выложу тебе готовый код html в котором внутри стоит мой скрипт(ты его найдёшь

)

Добавлено через 1 минуту

HTML5

<html>
<head>
    <link rel="stylesheet" type="text/css" href="main.css">
    <title></title>
</head>
<body>
<div class="my-panel">
    <div>
    </div>
</div>
<div class="window-view" >
    <div class="window-view-title">
        <span style="margin-left:10px;position:relative;">Заголовок окна</span>
        <div class="window-view-btn-exit"><img src="src/img/close.png" style="width:28px;height:28px;vertical-align:middle;display:inline-block;" alt=""></div></div>
    <iframe src="" frameborder="0" style="height:350px;width:100%;position:relative;"></iframe>
</div>
<div class="window-view" >
    <div class="window-view-title">
        <span style="margin-left:10px;position:relative;">Заголовок окна</span>
        <div class="window-view-btn-exit"><img src="src/img/close.png" style="width:28px;height:28px;vertical-align:middle;display:inline-block;" alt=""></div></div>
    <iframe src="" frameborder="0" style="height:350px;width:100%;position:relative;"></iframe>
</div>
<script>
    window.onload = init;
    function init() {
        var els = document.getElementsByClassName("window-view");
        function perebirator(e, id, array) {
            e.ondrag = function() { return false; };
            e.onselectstart = function() { return false; };
            e.onmousedown=mouseDown;
            e.onmouseup=mouseUp;
            e.onmouseout=mouseUp;
            e.onmousemove=mouseMove;
            e.style.left = "100px";
            e.style.top = "100px";
            e.style.display = "block";
        }
        for (var c in els){
            perebirator(els[c])
        }
        console.log(els)
    }
    function mouseDown(e) {
        e = e|| window.event;
        o= e.target;
        while (!o.classList.contains("window-view")) {
            o = o.parentNode;
        }
        var oX = parseInt(o.style.left);
        var oY = parseInt(o.style.top);
        var mouseX = e.clientX;
        var mouseY = e.clientY;
        o.setAttribute("offsetX",mouseX - oX);
        o.setAttribute("offsetY", mouseY - oY);
        o.setAttribute("dragging","y" );
        return false;
    }
    function mouseMove(e) {
        e=e||window.event;
        o= e.target;
        while (!o.classList.contains("window-view")) {
            o = o.parentNode;
        }
        if(o.getAttribute("dragging")!="y") return;
        var mouseX = e.clientX;
        var mouseY = e.clientY;
        var newX = mouseX - (+o.getAttribute("offsetX"));
        var newY = mouseY - (+o.getAttribute("offsetY"));
        o.style.left = newX + "px";
        o.style.top = newY + "px";
        return false;
    }
    function mouseUp(e) {
        o= e.target;
        while (!o.classList.contains("window-view")) {
            o = o.parentNode;
        }
        o.setAttribute("dragging", "n");
        return false;
    }
</script>
</body>
</html>

Добавлено через 53 секунды
теперь даже у меня работает)

@slenderface · 17.04.2015, 23:18 **[ТС]**

BANO, Мегаспасибо! Решили огромную проблему!

Добавлено через 17 минут
BANO, если не сложно, подскажите что здесь не так. окно не создаётся.

HTML5

1	<input type="submit" name="j" value="new window" onclick="newwin();">

Javascript

function newwin(){
var path = document.body; 
var vTitle = 'New Window'; 
var wSrc = '';
 
 block= '<div class="window_view"><div class="window_view_title"><span style="margin-left:10px;position:relative;">'+ wTitle + 
 '</span><div class="window_view_btn_exit"><img src="src/img/close.png" style="width:28px;height:28px;vertical-align:middle;display:inline-block;" alt=""></div>' +
 '</div><iframe src="' + wSrc + '" frameborder="0" style="height:350px;width:100%;position:relative;"></iframe></div>';
 path.innerHTML += block;
}

Добавлено через 2 минуты

Сообщение от slenderface

если не сложно, подскажите что здесь не так. окно не создаётся.

простите. уже понял в чём ошибка. ))

Добавлено через 3 минуты

Сообщение от slenderface

простите. уже понял в чём ошибка. ))

Извините новичка пожалуйста, но .... нет не понял

Добавлено через 1 час 9 минут

Сообщение от slenderface

Извините новичка пожалуйста, но .... нет не понял

всё, проблему решил. но теперь другая появилась: не понимаю, почему скрипт не работает без

Javascript

1
2
3

e.style.left = "100px";
            e.style.top = "100px";
            e.style.display = "block";

@BANO · 18.04.2015, 00:05

Сообщение от slenderface

e.style.left = "100px";
* * * * * * e.style.top = "100px";
* * * * * * e.style.display = "block";

вы это где взяли? я этого не вставлял

@slenderface · 18.04.2015, 00:24 **[ТС]**

Сообщение от BANO

вы это где взяли? я этого не вставлял

Javascript

function init() {
        var els = document.getElementsByClassName("window-view");
        function perebirator(e, id, array) {
            e.ondrag = function() { return false; };
            e.onselectstart = function() { return false; };
            e.onmousedown=mouseDown;
            e.onmouseup=mouseUp;
            e.onmouseout=mouseUp;
            e.onmousemove=mouseMove;
            e.style.left = "100px";
            e.style.top = "100px";
            e.style.display = "block";
        }

посмотрите сами

Добавлено через 1 минуту
Он без этих параметров не хочет дальше работать

@BANO · 18.04.2015, 00:31

slenderface, ну это-то понятно, у тебя в коде всё скакало именно от стиля, ты либо ставь позицию нулевой либо придумывай новый способ всё это делать

@slenderface · 18.04.2015, 00:39 **[ТС]**

Сообщение от BANO

slenderface, ну это-то понятно, у тебя в коде всё скакало именно от стиля, ты либо ставь позицию нулевой либо придумывай новый способ всё это делать

дело не в том, что он мне мешает, а в том, что здесь баг получается: когда я добавляю новое окно по кнопке, все окна становятся на нуливую точку = e.style.left = "100px"; e.style.top = "100px".
получается, что они смешиваются и наслаиваются друг на друга.
скрипт создания нового окна:

Javascript

function newwin(){
var path = document.body; 
var wTitle = 'New Window'; 
var wSrc = 'http://outplans.chatovod.ru';
 
 var block = '<div class="window_view"><div class="window_view_title"><span style="margin-left:10px;position:relative;">'+ wTitle + 
 '</span><div class="window_view_btn_exit"><img src="src/img/close.png" style="width:28px;height:28px;vertical-align:middle;display:inline-block;" alt=""></div>' +
 '</div><iframe src="' + wSrc + '" frameborder="0" style="height:350px;width:100%;position:relative;"></iframe></div>';
 path.innerHTML += block;
 init();
}

@BANO · 18.04.2015, 00:42

slenderface, а вы не делайте init()
вы сделайте через createElement() и просто к нему привяжите все функции

если хотите завтра, если не забуду сделаю

@slenderface · 18.04.2015, 00:44 **[ТС]**

BANO, ок, спасибо. я подожду. Извините что так, просто в JS я начинающий. я больше на C# WinForms программировал, а JS как то туговато идёт.

@kalabuni · 18.04.2015, 07:24

Сообщение от slenderface

спасибо. я подожду.

до морковкиного заговенья ждать придётся, увы

либо до того момента, когда обещавший вам решение коллега BANO узнает, наконец, что o.style.left (и o.style.top) вернут что-то отличное от пустоты лишь в двух случаях:
-- или когда непосредственно в теге прописано style="left: 123px; top: 234px"
-- или когда значения o.style.left (и o.style.top) ранее в коде установлены скриптом

если же left (и top) как-либо определены в стилевом блоке/файле (через правило, через класс), то вернётся пустота

@slenderface · 18.04.2015, 10:25 **[ТС]**

Сообщение от kalabuni

прописано style="left: 123px; top: 234px"

прописывал в стили и убирал строки из скрипта. он перестаёт работать.

@kalabuni · 18.04.2015, 10:31

Сообщение от slenderface

прописывал в стили

читать умеем или не умеем?

o.style.left (и o.style.top) вернут что-то отличное от пустоты лишь в двух случаях:
-- или когда непосредственно в теге прописано style="left: 123px; top: 234px"

не в стилях, а в теге, внутри него
ферштейн или опять нихт ферштейн?

Новые блоги и статьи
Создание макробота, как способа экономии времени и варианта ИИ. Hrethgir 28.01.2025 Чисто теоретически, создание ИИ на ПК можно разделить на части. Создать бота отвечающего за железо (эмулирование вкл, выкл, мышь, клавиатура), другой бот осуществляет распознавание изображений,. . .	[Golang] 121. Best Time to Buy and Sell Stock alhaos 28.01.2025 В этой задаче мы получаем слайс целых чисел, которые означают цену акции в разные моменты времени, и должны вернуть максимально возможную прибыль от купли продажи акции. / / . . .	Проектирование и моделирование hw_wired 28.01.2025 Введение в моделирование Моделирование представляет собой один из фундаментальных методов научного познания, который позволяет изучать объекты и явления через создание их упрощенных аналогов. В. . .	Алгоритмы и исполнители hw_wired 28.01.2025 Введение в алгоритмы В современном мире информационных технологий алгоритмы играют основополагающую роль в решении различных задач и автоматизации процессов. Алгоритм представляет собой точную. . .	Хранение информации hw_wired 28.01.2025 Введение: Роль систем хранения информации в современном мире В современную эпоху цифровых технологий эффективное хранение информации становится одним из ключевых факторов успешного развития любой. . .	Обработка числовой информации hw_wired 28.01.2025 Введение в обработку числовой информации В современном мире обработка числовой информации стала неотъемлемой частью как профессиональной деятельности, так и повседневной жизни. Электронные таблицы. . .
Мультимедиа hw_wired 28.01.2025 Введение в мультимедийные технологии В современном мире мультимедийные технологии стали неотъемлемой частью нашей жизни, проникнув во все сферы человеческой деятельности. Термин "мультимедиа". . .	Обработка текстовой информации hw_wired 28.01.2025 Введение в обработку текстовой информации В современном мире обработка текстовой информации играет фундаментальную роль в различных сферах человеческой деятельности. Текстовые редакторы стали. . .	Обработка графической информации hw_wired 28.01.2025 Введение в компьютерную графику Компьютерная графика стала неотъемлемой частью современного цифрового мира, пройдя впечатляющий путь развития от простейших черно-белых изображений до сложных. . .	Python в Алгоритмике: Решение задач hw_wired 28.01.2025 Введение в Python и Алгоритмику В современном мире программирование стало неотъемлемой частью образования и профессионального развития. Python зарекомендовал себя как один из самых популярных и. . .	Компьютер как универсальное устройство для работы с информацией hw_wired 28.01.2025 Введение в устройство компьютера Компьютер представляет собой универсальное электронное устройство, предназначенное для автоматической обработки информации. В современном мире компьютер стал. . .	Информация и информационные процессы hw_wired 28.01.2025 Понятие информации и ее виды В современном мире информация является одним из фундаментальных понятий, пронизывающих все сферы человеческой деятельности. Под информацией понимают любые сведения об. . .

@kalabuni супермизантроп 3941 / 2979 / 692 Регистрация: 18.04.2012 Сообщений: 8,626
	16.04.2015, 10:27	2
	Сообщение от slenderface Проблема в том, что скрипт работает по id в вашем HTML-коде имеется всего один id="Window"? при этом в вашем скрипте нет ни одного вызова метода getElementById ('Window') может, для начала попробуете его найти и нам показать? а уж потом будете выдумывать новые несуществующие проблемы 1

@slenderface 9 / 9 / 5 Регистрация: 24.03.2014 Сообщений: 313
	16.04.2015, 17:11 [ТС]	5
	BANO, огромное спасибо, но теперь по чему то вообще ничего не работает 0

@BANO Ренегат 1740 / 1085 / 386 Регистрация: 06.08.2014 Сообщений: 5,203 Записей в блоге: 1
	16.04.2015, 17:22	6
	там работает только на классах, а не на ид Добавлено через 49 секунд но может вообще не работать(я не проверял) 0

@slenderface 9 / 9 / 5 Регистрация: 24.03.2014 Сообщений: 313
	16.04.2015, 17:51 [ТС]	7
	Сообщение от BANO но может вообще не работать(я не проверял) ясненько и как быть? Добавлено через 1 минуту Сообщение от BANO сделать всё по атрибутам этого дива, это div-у где-то прописывать? 0

@BANO Ренегат 1740 / 1085 / 386 Регистрация: 06.08.2014 Сообщений: 5,203 Записей в блоге: 1
	16.04.2015, 20:51	8
	на самом деле всё проще ты должен поствить тому div не id а класс "window", и вообще всем дивам которые должны быть окнами я точил код именно под класс, а атрибуты нужны вместо переменных типо offset или dragobject что делает мой скрипт не зависимым от количества этих "окон" 0

@BANO Ренегат 1740 / 1085 / 386 Регистрация: 06.08.2014 Сообщений: 5,203 Записей в блоге: 1
	18.04.2015, 00:05	12
	Сообщение от slenderface e.style.left = "100px"; * * * * * * e.style.top = "100px"; * * * * * * e.style.display = "block"; вы это где взяли? я этого не вставлял 1

@BANO Ренегат 1740 / 1085 / 386 Регистрация: 06.08.2014 Сообщений: 5,203 Записей в блоге: 1
	18.04.2015, 00:31	14
	slenderface, ну это-то понятно, у тебя в коде всё скакало именно от стиля, ты либо ставь позицию нулевой либо придумывай новый способ всё это делать 0

@BANO Ренегат 1740 / 1085 / 386 Регистрация: 06.08.2014 Сообщений: 5,203 Записей в блоге: 1
	18.04.2015, 00:42	16
	slenderface, а вы не делайте init() вы сделайте через createElement() и просто к нему привяжите все функции если хотите завтра, если не забуду сделаю 0

@slenderface 9 / 9 / 5 Регистрация: 24.03.2014 Сообщений: 313
	18.04.2015, 00:44 [ТС]	17
	BANO, ок, спасибо. я подожду. Извините что так, просто в JS я начинающий. я больше на C# WinForms программировал, а JS как то туговато идёт. 0

@kalabuni супермизантроп 3941 / 2979 / 692 Регистрация: 18.04.2012 Сообщений: 8,626
	18.04.2015, 07:24	18
	Сообщение от slenderface спасибо. я подожду. до морковкиного заговенья ждать придётся, увы либо до того момента, когда обещавший вам решение коллега BANO узнает, наконец, что o.style.left (и o.style.top) вернут что-то отличное от пустоты лишь в двух случаях: -- или когда непосредственно в теге прописано style="left: 123px; top: 234px" -- или когда значения o.style.left (и o.style.top) ранее в коде установлены скриптом если же left (и top) как-либо определены в стилевом блоке/файле (через правило, через класс), то вернётся пустота 1

@slenderface 9 / 9 / 5 Регистрация: 24.03.2014 Сообщений: 313
	18.04.2015, 10:25 [ТС]	19
	Сообщение от kalabuni прописано style="left: 123px; top: 234px" прописывал в стили и убирал строки из скрипта. он перестаёт работать. 0

@kalabuni супермизантроп 3941 / 2979 / 692 Регистрация: 18.04.2012 Сообщений: 8,626
	18.04.2015, 10:31	20
	Сообщение от slenderface прописывал в стили читать умеем или не умеем? o.style.left (и o.style.top) вернут что-то отличное от пустоты лишь в двух случаях: -- или когда непосредственно в теге прописано style="left: 123px; top: 234px" не в стилях, а в теге, внутри него ферштейн или опять нихт ферштейн? 0

Реализовать окна сделанные на блоках div

Решение