PHP- Kodu:
<html>
<head>
<title>sürükle-birak</title>
<style type="text/css">
a.etiket {
font-family:Verdana;
font-size:15px;
font-weight:bold;
color:white;
text-decoration:none;
}
</style>
<script type="text/javascript" language="JavaScript">
function dedekteEt(){
this.ver=navigator.appVersion
this.dom=document.getElementById?1:0
this.ie5=(this.ver.indexOf("M+++ 5")>-1 && this.dom)?1:0;
this.ie4=(document.all && !this.dom)?1:0;
this.ns4=(document.layers && !this.dom)?1:0;
this.ns5=(this.dom && parseInt(this.ver) >= 5) ?1:0;
this.tarayici=(this.ie4 || this.ie5 || this.ns4 || this.ns5)
return this
}
tarayici=new dedekteEt()
function kaybol(katman) {
if (document.all) {
document.all[katman].style.visibility="hidden";
}
else if (document.layers) {
document.layers[katman].visibility="hide";
}
else {
document.getElementById(katman).style.visibility="hidden";
}
}
function git(katman,x,y) {
if (document.all) {
document.all[katman].style.pixelLeft = x;
document.all[katman].style.pixelTop = y;
}
else if (document.layers) {
document.layers[katman].moveTo(x,y);
}
else {
document.getElementById(katman).style.left = x +"px";
document.getElementById(katman).style.top = y +"px";
}
}
function solOku(katman) {
if (document.all) {
return document.all[katman].style.pixelLeft;
}
else if (document.layers) {
return document.layers[katman].left;
}
else {
return parseInt(document.getElementById(katman).style.left);
}
}
function ustOku(katman) {
if (document.all) {
return document.all[katman].style.pixelTop;
}
else if (document.layers) {
return document.layers[katman].top;
}
else {
return parseInt(document.getElementById(katman).style.top);
}
}
function baslangic(){
if(tarayici.ns4 || tarayici.ns5){
scrolled="window.pageYOffset";
}
else {
scrolled="document.body.scrollTop";
}
if(tarayici.ns4){
document.captureEvents(Event.MOUSEMOVE)
}
document.onmousemove=move;
}
var tasinabilir=0;
var x,y;
function move(e){
if(tarayici.ns4 || tarayici.ns5){
x=e.pageX;
y=e.pageY;
}
else {
x=event.x;
y=event.y;
}
if(tarayici.ie4 || tarayici.ie5) {
y=y+eval(scrolled)
}
if (tasinabilir==1) {
git('popup',x-tempX,y-tempY);
return false;
}
}
var tempX,tempY;
function surukle(){
tasinabilir=1;
tempX=x-solOku('popup');
tempY=y-ustOku('popup');
}
function birak(){
tasinabilir=0;
}
</script>
</head>
<body onload="baslangic();">
<div id="popup" style="position: absolute; top:100px; left:100px; visibility:visible;">
<table cellpadding="0" cellspacing="0" width="254" height="320" border="0">
<tr>
<td width="2" bgcolor="Black"><img src="images/piksel.gif" width="1" height="1" border="0" alt=""></td>
<td width="250" bgcolor="Black">
<table width="250">
<tr>
<td width="230" align="left"><a class="etiket" href="#" onmousedown="surukle();return false" onmouseup="birak()">Beni sürükle</a></td>
<td width="20" align="right"><a class="etiket" onclick="kaybol('popup')" href="#">X</a></td>
<td width="5"></td>
</tr>
</table>
</td>
<td width="2" bgcolor="Black"><img src="images/piksel.gif" width="1" height="1" border="0" alt=""></td>
</tr>
<tr>
<td height="320" bgcolor="Black"><img src="images/piksel.gif" width="1" height="1" border="0" alt=""></td>
<td height="320" bgcolor="Silver" valign="top">
<table width="250">
<tr>
<td width="5"></td>
<td width="240" valign="top">
<font face="Verdana" size="+1" color="Maroon">
<br>
<b>DHTML pop-up pencerecikleri</b>
<br><br>
DHTML sayesinde sürüklenebilir pop-up pencerecikleri yapabilirsiniz.
Bu sayede oldukça etkileyici web sayfalari elde edeceksiniz.</font>
</td>
<td width="5"></td>
</tr>
</table>
</td>
<td height="320" bgcolor="Black"><img src="images/piksel.gif" width="1" height="1" border="0" alt=""></td>
</tr>
<tr>
<td bgcolor="Black"><img src="images/piksel.gif" width="1" height="2" border="0" alt=""></td>
<td bgcolor="Black"><img src="images/piksel.gif" width="1" height="2" border="0" alt=""></td>
<td bgcolor="Black"><img src="images/piksel.gif" width="1" height="2" border="0" alt=""></td>
</tr>
</table>
</div>
</body>
</html>
12-03-2008, 02:39
Benzer Konular 
