Witam, pobralem sobie taka funkcje w js, i mam pewien problemik z jej przerobieniem, chcialem dorobic mozliwosc przenoszenia kliku okien, teraz moge przenosic tylko ostatnio otwarte okno.
var isMozilla;
var objDiv = null;
var originalDivHTML = "";
var DivID = "";
var over = false;
function displayFloatingDiv(divId, title, left, top)
{
var items;
items = document.getElementsByName(divId);
for (i = 0; i <= items.length; i++) {
width = 300;
height = 200;
DivID = divId;
items[i].style.width = width + 'px';
items[i].style.height = height + 'px';
items[i].style.left = left + 'px';
items[i].style.top = top + 'px';
var addHeader;
if (originalDivHTML == "")
originalDivHTML = items[i].innerHTML;
addHeader = '<table style="width:' + width + 'px" class="floatingHeader">' +
'
<tr><td onmouseover="over=true;" onmouseout="over=false;" style="cursor:move;height:18px">' + title + '
</td>' +
'
<td style="width:18px" align="right"><a href="java script:hiddenFloatingDiv('' + divId + '');void(0);">' +
'
<img alt="Close..." title="Close..." src="close.jpg" border="0"></a></td></tr></table>';
// add to your div an header
items[i].innerHTML = addHeader + originalDivHTML;
items[i].className = 'dimming';
items[i].style.visibility = "visible";
}
}
//
//
//
function hiddenFloatingDiv(divId, id)
{
document.getElementById(divId).innerHTML = originalDivHTML;
document.getElementById(divId).style.visibility='hidden';
document.getElementById('dimmer').style.visibility = 'hidden';
DivID = "";
}
//
//
//
function MouseDown(e)
{
if (over)
{
if (isMozilla) {
objDiv = document.getElementById(DivID);
X = e.layerX;
Y = e.layerY;
}
else {
objDiv = document.getElementById(DivID);
objDiv = objDiv.style;
X = event.offsetX;
Y = event.offsetY;
}
}
}
//
//
//
function MouseMove(e)
{
if (objDiv) {
if (isMozilla) {
objDiv.style.top = (e.pageY-Y) + 'px';
objDiv.style.left = (e.pageX-X) + 'px';
return true;
}
else
{
objDiv.pixelLeft = event.clientX-X + document.body.scrollLeft;
objDiv.pixelTop = event.clientY-Y + document.body.scrollTop;
return true;
}
}
}
//
//
//
function MouseUp()
{
objDiv = null;
}
//
//
//
function init()
{
// check browser
isMozilla = (document.all) ? 0 : 1;
if (isMozilla)
{
document.captureEvents(Event.MOUSEDOWN | Event.MOUSEMOVE | Event.MOUSEUP);
}
document.onmousedown = MouseDown;
document.onmousemove = MouseMove;
document.onmouseup = MouseUp;
// add the div
// used to dim the page
}
// call init
init();
Plik html;
<LINK REL=StyleSheet HREF="dimming.css" TYPE="text/css">
<body leftmargin="0" topmargin="0">
Click
<a href="java script:displayFloatingDiv('windowcontent', 'Floating1', 100, 100)">here
</a>and
<a href="java script:displayFloatingDiv('windowcontent2', 'Floating2', 115, 115)">here
</a>
<div style="visibility:hidden" name="windowcontent" id="windowcontent"> Podaj swoje imie...
<div style="visibility:hidden" name="windowcontent2" id="windowcontent2"> Podaj swoje nazwisko...
Plik css:
div.dimmer
{
visibility: hidden;
position:absolute;
left:0px;
top:0px;
font-family:verdana;
font-weight:bold;
padding:40px;
/* ieWin only stuff */
}
div.dimming {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
font-style: normal;
background-color: #ffffff;
position:absolute;
/* set z-index higher than possible */
z-index:10000;
visibility: hidden;
border-style: solid;
border-color: #999999;
border-width: 1px;
}
table.floatingHeader
{
background-color: #0000ff;
color:#ffffff;
}