Üst resimde de görüldüğü Gibi Yazılarınız İÇERİSİNDE Farklı amaçla kullanılabileceğiniz Bir Özellik
<! DOCTYPE html PUBLIC "- // W3C // DTD XHTML 1.0 Transitional // EN"
"Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<Html xmlns = "http://www.w3.org/1999/xhtml" lang = "tr" xml: lang = "tr">
<Head>
<Meta http-equiv = "Content-Type" content = "text / html; charset = iso-8859-9" />
<Script type = "text / javascript">
var Sürükle = {
obj: null,
init: fonksiyonu (o oRoot, Minx, Maxx, Miny, Maxy, bSwapHorzRef, bSwapVertRef, fXMapper, fYMapper)
{
o.onmousedown = Drag.start;
o.hmode = bSwapHorzRef? yanlış doğru;
o.vmode = bSwapVertRef? yanlış doğru;
o.root = oRoot && oRoot! = null? oRoot: o;
Eğer (o.hmode && isNaN (parseInt (o.root.style.left))) o.root.style.left = "0px";
(o.vmode && isNaN (parseInt (o.root.style.top))) o.root.style.top = "0px" ise;
Eğer o.root.style.right = "0px" (o.hmode && isNaN (parseInt (o.root.style.right))!);
(! o.vmode && isNaN (parseInt (o.root.style.bottom))) o.root.style.bottom = "0px" ise;
o.minX = typeof Minx! = 'tanımsız'? Minx: null;
o.minY typeof Miny! = 'tanımsız' =? Miny: null;
o.maxX = typeof Maxx! = 'tanımsız'? Maxx: null;
o.maxY typeof Maxy! = 'tanımsız' =? Maxy: null;
o.xMapper = fXMapper? fXMapper: null;
o.yMapper = fYMapper? fYMapper: null;
o.root.onDragStart = new Function ();
o.root.onDragEnd = new Function ();
o.root.onDrag = new Function ();
},
başlangıç: function (e)
{
var o = Drag.obj = Bu;
e = Drag.fixE (e);
var y = parseInt (o.vmode o.root.style.top: o.root.style.bottom?);
var x = parseInt (o.hmode o.root.style.left: o.root.style.right);
o.root.onDragStart (x, y);
o.lastMouseX = e.clientX;
o.lastMouseY = e.clientY;
Eğer (o.hmode) {
if (o.minX! = null) o.minMouseX = e.clientX - x + o.minX;
if (o.maxX! = null) o.maxMouseX = o.minMouseX + o.maxX - o.minX;
} Else {
if (o.minX! = null) o.maxMouseX = -o.minX + e.clientX + x;
if (o.maxX! = null) o.minMouseX = -o.maxX + e.clientX + x;
}
Eğer (o.vmode) {
y + o.minY - (! o.minY = sıfır) o.minMouseY = e.clientY halinde
; o.minY - (! o.maxY = null) o.maxMouseY = o.minMouseY + o.maxY eğer
} Else {
(! o.minY = null) o.maxMouseY = -o.minY + e.clientY + y ise;
(! o.maxY = null) o.minMouseY = -o.maxY + e.clientY + y ise;
}
document.onmousemove = Drag.drag;
document.onmouseup = Drag.end;
return false;
},
sürükleme: function (e)
{
e = Drag.fixE (e);
var o = Drag.obj;
var ey = e.clientY;
var ex = e.clientX;
var y = parseInt (o.vmode o.root.style.top: o.root.style.bottom?);
var x = parseInt (o.hmode o.root.style.left: o.root.style.right);
var nx, ny;
(o.minX! = null) ex = o.hmode olur? Math.max (ex, o.minMouseX): Math.min (ex, o.maxMouseX);
(o.maxX! = null) ex = o.hmode olur? Math.min (ex, o.maxMouseX): Math.max (ex, o.minMouseX);
(o.minY! = null) ey = o.vmode olur? Math.max (ey, o.minMouseY): Math.min (ey, o.maxMouseY);
(o.maxY! = null) ey = o.vmode olur? Math.min (ey, o.maxMouseY): Math.max (ey, o.minMouseY);
nx = x + (? (ex - o.lastMouseX) * (o.hmode 1: -1));
;: - (-1) o.lastMouseY) * (o.vmode 1 (ey?) ny y + =
Eğer (o.xMapper) nx = o.xMapper (y)
else if (o.yMapper) ny = o.yMapper (x)
Drag.obj.root.style [o.hmode? ] = Nx + "px" "doğru";: "sol"
Drag.obj.root.style [o.vmode? "Top": "alt"] = ny + "px";
Drag.obj.lastMouseX = ex;
Drag.obj.lastMouseY = ey;
Drag.obj.root.onDrag (nx, NY);
return false;
},
son: function ()
{
document.onmousemove = null;
document.onmouseup = null;
Drag.obj.root.onDragEnd (parseInt (Drag.obj.root.style [? Drag.obj.hmode "sol": "hakkı"]),
parseInt (Drag.obj.root.style [Drag.obj.vmode "top":? "alt"]));
Drag.obj = null;
},
Fixe: function (e)
{
(typeof e == 'undefined') e = window.event eğer;
if (typeof e.layerX == 'tanımsız') e.layerX = e.offsetX;
if (typeof e.layerY == 'tanımsız') e.layerY = e.offsetY;
e dönmek;
}
};
</ Script>
<Style type = "text / css">
#root {
position: absolute;
Yükseklik: 300px;
genişlik: 300px;
background-color: # F4F4F4;
Sınır: 1px solid # 333;
}
#handle {
margin: 2px;
padding: 2px;
genişliği: 98%;
Renk: Beyaz;
background-color: lacivert;
font-weight: bold;
}
</ Style>
</ Head>
<Body>
<Div id = "root" style = "left: 50px; top: 100px;">
<Div id = "sap"> Buraya Başlık </ div>
Bilgi Cafem 61
Buraya İçerik yazınız
</ Div>
<Script language = "javascript">
var theHandle = document.getElementById ("işlemek");
var theRoot = document.getElementById ("root");
Drag.init (theHandle, theRoot);
</ Script>
</ Body>
</ Html>
Blogumuza Abone Olun
Yeni Yazılar e-posta Adresinize Gelsin
Not: Gelen Maili Aktif Etmeyi Unutmayınız!
Yorum Gönder Blogger Facebook