حرکت لایه ها

aloke

Member
سلام به همگی میخواستم بدونم توابعی در javascript برای حرکت دادن لایه ها وجود دارد با این قابلیت که روی همه ی browser ها یا حداقل روی firefox و IE اجرا بشه و با DOCTYPE هماهنگ باشه .

ممنون میشم اگه جواب بدید .
موفق باشید .
 

farik

Well-Known Member
نميدونم با Doctype هاهنگه يا نه ولي هست خواستيد بگيد بزارم...
 

aloke

Member
آره اگه لطف کنید بزارید ممنون میشم .
فوقش امتحان میکنیم .

بازم ممنون
 

farik

Well-Known Member
ببخشيد شرمنده اينم از اون كد فقط بايد position لايه مورد نظر absolute باشه:
this.style.posHeight='10';this.style.posLeft='50'

اينم يك مثال:خودم نوشتم:
<html dir="rtl">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>asdasd</title>
</head>

<body>

<script>
move=false;
</script>
<center>
<div style="background:gray;cursor:move; height:51px;width:167px" onclick="if(this.style.position!='absolute'){this.style.position='absolute';this.style.posHeight='10';this.style.posLeft='50';}if(move==false){move=true}else{move=false};" onmousemove="h=this.style.posHeight;w=this.style.posWidth;;if(move){if(this.style.position=='absolute'&&(event.clientY-h<this.style.posTop||this.style.posTop==0)){this.style.posTop=event.clientY+10;}else{this.style.posTop=event.clientY-14;};if(this.style.position=='absolute'&&(event.clientX-w<this.style.posLeft||this.style.posLeft==0)){this.style.posLeft=event.clientX-40;}else{this.style.posLeft=event.clientX-50;}};"><a href=http://tab_o_tab.mihanblog.com>Writen /by tabotab drsign</a></div>
<script>
</script>

</center>
</body>
</html>
 

aloke

Member
ممنون فقط اگه توابع یا دستورات دیگه ای هم هست اونا را هم بزار .....
بازم ممنون
 

farik

Well-Known Member
راستش من بلد نيستم ولي هست يك كد جاوا اسكريپت براي نمونه معرفي كرده بودن يكي از دوستان در تاپيك هاي ديگركه اگر يك سرچ بكنيد پيدا ميشه ولي اون كد در 4000 و چند خط نوشته شده بود كه البت خيلي هم پيشرفته بود....
دوستان اگر آدرسش رو دارند كمك كنند و براي اين دو.ستان عزيز بزارند
يا علي...
 

farik

Well-Known Member
با سلام مجدد
ببخشيد دوباره تاپيك رو بالا ميارم ولي گفتم بعد از مدتي كه تونستم كد مورد نظر دوست عزيزمون رو بنويسم حيفه اون رو نزارم ...شايد به درد ايشون نخوره ولي به درد كسايي كه سرچ ميكنن ميخوره:
<html dir="rtl">

<body id=body >
<script>
var n=(document.all)?0:1;
tr=new Array();
if(n){ document.captureEvents(Event.MOUSEMOVE | Event.MOUSEDOWN | Event.MOUSEUP)}
document.onmousemove=move;
function getElementByclass(class_name)
{ rt=new Array();
var j,a;
j=0;
a=document.getElementsByTagName('*');
for(i=0;i<a.length;i++)
{
if(a.className==class_name){rt[j]=document.getElementsByTagName('*');j++}
}

return rt;
}

function move(e)
{
if(n){x=e.pageX}else{x=event.x}
if(n){y=e.pageY}else{y=event.y}
movers=getElementByclass('move');

for(i=0;i<movers.length;i++)
{
if(tr[movers.id]){
m=movers;
he=m.offsetHeight;
wi=m.offsetWidth;
m.style.left=x-(wi/2);
m.style.top=y-(he/2);
}
}

}
function add()
{
color=prompt("what is your color?",'black');
init=prompt("what is the passage in it?",' ');
id=prompt("what is its id?",'nothing');
if(!color){color="black";}
if(!init){init=" ";}
if(!id){id="Imam";}
a='<div onmousedown="tr[this.id]=true;" onmouseup="tr[this.id]=false;" class=move id='+id+' style="height:88px;width:204px;background:'+color+';position:absolute;cursor:move;">'+init+'</div>';
document.getElementById('body').innerHTML+=a;
tr[id]=false;
}
function start_move()
{
movers=getElementByclass('move');
for(i=0;i<movers.length;i++)
{
tr[movers.id]=false;
movers.style.position='absolute'
movers.style.cursor='move';
}
}
setTimeout('start_move();',10);
//writen by tabotabdesign
</script>
<div onmousedown='tr[this.id]=true' onmouseup=tr[this.id]=false; id=farshad class=move style="height:88px;width:204px;background:black;">
eraseraser</div>
<div onmousedown='tr[this.id]=true' onmouseup=tr[this.id]=false; id=farzan class=move style="background:red;">
wsadasdfaefwaef</div>
</div>
<div onclick="add();">asdasd
</div>

</body>

</html>


اين كد با فاير فاكس ،اپرا و اينترنت اكسپلورر هماهنگه و براي ايجاد نشدن مشكلي از كلاس براي انتخاب اشيا انتخاب ميكنه البته استفاده از مشخصه i d هم لازمه....
 

جدیدترین ارسال ها

بالا