بخصوص مسألة drag فقد سبق لي أن برمجت نوافذ متحركة بالجافاسكريبت، وهي نفس المبدأ في البرمجة مع اكشن سكريبت
تجد الملف في المرفقات ضمن هذا الرابط
http://www.swalif.net/softs/showpost...5&postcount=88
كود PHP:
<style>
.clickDiv{
filter:alpha(opacity=77);
}
.normalDiv{
filter:alpha(opacity=100);
}
.eventDiv{
border:thin #000000 solid;
}
</style>
<script>
//////////////////////
var numDiv = 4; // change
var cursorEvent = "all-scroll"; // change
var cursorClick = "move"; // change
/////////////////////
var wino=0,X,Y,T,L,x,y,i,tagDiv,S=1,oldTop,OldLeft,forDiv,divId,per=false,TagImage,tgs;
drags = function(){
if (event.srcElement.className=="drag"){
wino = 1;
///
Img=event.srcElement;
///
tagDiv = document.getElementById(parseInt(Img.id)+'div');
oldTop = tagDiv.style.top;
oldLeft = tagDiv.style.left;
///
tagDiv.style.zIndex = S;
S++;
///
tagDiv.className = "ClickDiv";
Img.style.cursor = cursorClick;
///
L=tagDiv.style.pixelLeft;
T=tagDiv.style.pixelTop;
x=event.clientX;
y=event.clientY;
document.onmousemove = function(){
if(event.button==1&&wino){
X=event.clientX;
Y=event.clientY;
var tagDivS = tagDiv.style;
tagDivS.pixelLeft = L+X-x
tagDivS.pixelTop = T+Y-y;
var Ttop = tagDivS.pixelTop;
var Tleft = tagDivS.pixelLeft;
///*
for(i=1;i<numDiv+1;i++){
forDiv = document.getElementById(i+'div');
var forDivS = forDiv.style;
forDiv.className = "normalDiv";
tagDiv.className = "clickDiv";
var Ftop = forDivS.pixelTop;
var Fleft = forDivS.pixelLeft;
///////
var ImgW = Img.width;
var ImgH = Img.height;
if(Ttop>Ftop && Ttop<Ftop+ImgH && Tleft>Fleft && Tleft<Fleft+ImgW){
forDiv.className = "eventDiv";
//forDivS.border = 'thin #000000 solid';
divId = forDiv.id;
per = true
}
}
return false
}
}
}
}
document.onmousedown = drags
window.onunload = function(){
/*
var msg = "\
************************** \n\
Dev: Ibrahim Bidi \n\
Url: www.WinoScript.com \n\
Email: Zizwar@hotmail.com \n\
Username: Zizwar` \n\
************************** \n\
";
alert(msg)
*/
}
document.onmouseup = function(){FuncWino();wino = 0}
FuncWino = function(){
if(wino){
//tagDiv.style.filter = 'alpha(opacity=100)';
tagDiv.className = 'normalDiv';
Img.style.cursor = cursorEvent;
tagDiv.style.top = oldTop;
tagDiv.style.left = oldLeft;
///
if(per){
var DivIds = document.getElementById(divId);
var oldHtml = tagDiv.innerHTML;
var oldId = tagDiv.id
////
tagDiv.innerHTML = DivIds.innerHTML;
DivIds.innerHTML = oldHtml;
tagDiv.id = DivIds.id;
DivIds.id = oldId;
DivIds.className = 'normalDiv';
per = false
}
///
}
}
window.onload = function(){
for(i=1;i<numDiv+1;i++){
TagImage = document.getElementById(i+'img');
TagImage.className = "drag";
tgs = TagImage.style;
tgs.position = "relative";
tgs.cursor = cursorEvent;
}
}
</script>
<!-- ///////////////HTML//////////////// -->
<div id="1div" style="position:absolute; left:41px; top:17px">
<image src="img/w.JPG" id="1img">
<BR>
ZZZZZZZZZZZZZZZZ<BR>
ZZZZZZZZZZZZZZZZ<BR>
ZZZZZZZZZZZZZZZZ<BR>
ZZZZZZZZZZZZZZZZ<BR>
ZZZZZZZZZZZZZZZZ<BR>
ZZZZZZZZZZZZZZZZ<BR>
ZZZZZZZZZZZZZZZZ<BR>
ZZZZZZZZZZZZZZZZ<BR>
</div>
<!-- /////////// -->
<div id="2div" style="position:absolute; left:328px; top:17px;">
<image src="img/b.JPG" id="2img">
<BR>
SSSSSSSSSSSSSSSS<BR>
SSSSSSSSSSSSSSSS<BR>
SSSSSSSSSSSSSSSS<BR>
SSSSSSSSSSSSSSSS<BR>
SSSSSSSSSSSSSSSS<BR>
SSSSSSSSSSSSSSSS<BR>
SSSSSSSSSSSSSSSS<BR>
SSSSSSSSSSSSSSSS<BR>
</div>
<!-- /////////// -->
<div id="3div" style="position:absolute; left:47px; top:250px">
<image src="img/r.JPG" id="3img">
<BR>
TTTTTTTTTTTTTTTT<BR>
TTTTTTTTTTTTTTTT<BR>
TTTTTTTTTTTTTTTT<BR>
TTTTTTTTTTTTTTTT<BR>
TTTTTTTTTTTTTTTT<BR>
TTTTTTTTTTTTTTTT<BR>
TTTTTTTTTTTTTTTT<BR>
TTTTTTTTTTTTTTTT<BR>
</div>
<!-- /////////// -->
<div id="4div" style="position:absolute; left:328px; top:250px">
<image src="img/s.JPG" id="4img">
<BR>
AAAAAAAAAAAAAAAA<BR>
AAAAAAAAAAAAAAAA<BR>
AAAAAAAAAAAAAAAA<BR>
AAAAAAAAAAAAAAAA<BR>
AAAAAAAAAAAAAAAA<BR>
AAAAAAAAAAAAAAAA<BR>
AAAAAAAAAAAAAAAA<BR>
AAAAAAAAAAAAAAAA<BR>
</div>
<!-- /////////// -->
رد مع اقتباس
مع كل الاسف
المشاركة الأصلية كتبت بواسطة Akwad Net
