معلومات المنتج:
<!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">
<الرأس>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<العنوان>العنوان>العنوان>
<نمط النوع = "نص/CSS">
<!--
#div1 {العرض:1px;الارتفاع:200px;لون الخلفية: أسود;الموضع:مطلق;left:100px;top:70px;float:left}
#div1 تمتد {الموضع:مطلق؛الأعلى:-15px}
#div2 {العرض:1px;الارتفاع:200px;لون الخلفية:أزرق منتصف الليل;الموضع:مطلق;يسار:800px;أعلى:70px;عائم: يسار}
#div2 تمتد {الموضع:مطلق؛الأعلى:-15px}
#div3 {العرض:1px;الارتفاع:200px;لون الخلفية:فوشيا;الموضع:مطلق;يسار:300px;أعلى:70px;عائم: يسار}
#div3 تمتد {الموضع:مطلق؛الأعلى:-15px}
#div4 {العرض:1px;الارتفاع:200px;لون الخلفية:أرجواني داكن;الموضع:مطلق;يسار:500px;أعلى:70px;عائم: يسار}
#div4 تمتد {الموضع:مطلق؛الأعلى:-15px}
#grap {width:200px;height:200px;background:red;position:absolute;left:300px;top:74px;float: left;}
الإدخال {العرض: 100 بكسل؛ الهامش الأيسر: 90 بكسل؛}
-->
</نمط>
<نوع البرنامج النصي = "نص/جافا سكريبت">
معرف الوقت فار
وظيفة بدء الحركة (الهدف) {
var oDiv=document.getElementById('grap')
ClearInterval(timeId); //الحصول على أفضل النتائج
speed=oDiv.offsetLeft<target?8:-9;
timeId=setInterval(function(){
إذا(Math.abs(oDiv.offsetLeft-target)<=6){
oDiv.style.left=target+'px'; // يجب أن يكون لديك المزيد من المعلومات حول كيفية التعامل مع هذه المشكلة.
ClearInterval(timeId); document.title="目标"+oDiv.style.left;
}
آخر{
oDiv.style.left=oDiv.offsetLeft+speed+'px';
}
},30);
}
</script>
</الرأس>
<الجسم>
<div id="div1"><span>100 بكسل</span></div>
<div id="div2"><span>800 بكسل</span></div>
<div id="div3"><span>300 بكسل</span></div>
<div id="div4"><span>500 بكسل</span></div>
<نوع الإدخال = "زر" القيمة = "القيمة 100 بكسل" عند النقر = "startMove (100)"/>
<نوع الإدخال = "زر" القيمة = "حدد 300 بكسل" عند النقر = "startMove (300)"/>
<نوع الإدخال = "زر" القيمة = "حدد 500 بكسل" عند النقر = "startMove (500)"/>
<نوع الإدخال = "زر" القيمة = "حدد 800 بكسل" عند النقر = "startMove (800)"/>
<div id="grap" </div>
</الجسم>
</html>