الفريق العربي للبرمجةأرشيف المنتديات · 2000 – 2023
نسخة أرشيفية للقراءة فقط — التسجيل والمشاركة مغلقان، والمحتوى محفوظ كما كان.

عدم حدوث كولجن للصورة

بدأه GProgrammer في 16 أكتوبر 2010 · 4 رد · 640 مشاهدة · في قسم البرمجة بــ Javascript
مشاركة: واتساب X فيسبوك تيليجرام
#1 صاحب الموضوع

السلام عليكم

لدي هذا الكود و الفنكشن في الأسفل لا تعمل لا أعرف ما المشكلة

<html>
<head>
<title>hope it works</tile>
<script type= "text/javascript">



var img1,img2; 
var animIndex;
var anim;

////////////////////////////// to create object
function person ( x,y,vx,vy,img,height,width)
{  this .x= x ;
   this .y=y;
   this .vx=vx;
   this .vy=vy;
   this .img=img;
   this .height=height;
   this .width=width;

 }
 var anim1 = new person ;
 var anim2=new person;
/////////////////////////////

//var x, y,x1,y1; 
//var vx, vy,vx1,vy1;

function main() {
	//img1=document.createElement("img");
	 anim1.img=document.createElement("img");
	//document.body.appendChild(img1);
	document.body.appendChild(anim1.img);
	anim1.img.src="pcStay.png";


	//////////////////////////
	//img2=document.createElement("img");
	//document.body.appendChild(img2);

	anim2.img=document.createElement("img");
	document.body.appendChild(anim2.img);

	//anim=new Array ("pcWalk0.png", "pcWalk0.png");
	anim=new Array ("pcWalk0.png" , "pcWalk0.png");


	animIndex=0;
     ////////////////////////////////////
	//img1.style.position="absolute";
	//img2.style.position="absolute";
	//x=0;
	//x1=6;
	//y=0;
    //y1=0;
    //vx=10;
	//vx1=3;
	//vy=10;
	//vy1=3;
	///////////////////////////////////

	anim1.img.style.position="absolute";
	anim2.img.style.position="absolute";
	anim1.x=0;
	anim2.x=200;
	anim1.y=0;
	anim2.y=200;
	anim1.vx=10;
	anim2.vx=3;	
	anim1.vy=10;
	anim2.vy=3;
	height=20; 
	width=20;


	// send fynction update --> this function dosn't accpet the anim variable ?? way?? the one argument of setInterval
   //	is must be a function ?
	setInterval(update, 50);	
} // end main function

// this function don't work any thing but i can't edit without the output is hert

function update() {
	//img1.src=anim[0];
	//img2.src=anim[1];
	anim1.img.src=anim[0];
	anim2.img.src=anim[1];
	animIndex++;
	if (animIndex>=anim.length) {
		animIndex=0;
	}
	 //////////// for img1 
	//x+=vx;
	//y+=vy;
	//if (x<=0 || x>=720) vx=-vx;
	//if (y<=0 || y>=520) vy=-vy;
	//img1.style.left=x+"px";
	//img1.style.top=y+"px";
	//////////////////////////////

	anim1.x=anim1.x+anim1.vx;
	anim1.y=anim1.y+anim1.vy;
	if (anim1.x<=0 || anim1.x>=720) anim1.vx=-anim1.vx;
	if (anim1.y<=0 || anim1.y>=520) anim1.vy=-anim1.vy;
	anim1.img.style.left=anim1.x+"px";
	anim1.img.style.top=anim1.y+"px";


	/////////////////for img2
	//x1+=vx1;
	//y1+=vy1;
	//if (x1<=0 || x1>=720) vx1=-vx1;
	//if (y1<=0 || y1>=520) vy1=-vy1;
	//img2.style.left=x1+"px";
	//img2.style.top=y1+"px";
	//////////////////////////////


	anim2.x=anim2.x+anim2.vx;
    anim2.y=anim2.y+anim2.vy;
	if (anim2.x<=0 || anim2.x>=720) anim2.vx=-anim2.vx;
	if (anim2.y<=0 || anim2.y>=520) anim2.vy=-anim2.vy;
	anim2.img.style.left=anim2.x+"px";
	anim2.img.style.top=anim2.y+"px";


}


////////////////////////////////////// calculates the distance between two points
// هذه الفنكشن فيها مشكلة 
function distanceTo(anim1, anim2) {
    var dx = anim1.x - anim2.x;
    var dy = anim1.y - anim2.y;

    return Math.sqrt(dx * dx + dy * dy);
} 


//////////////////////////////////////////////////// checks to see if the enemy collides with the main object.
// هذه الفنكشن ربما فيها مشكلة 
function checkForCollision() {
    // length of the array .

    var distance;
        distance = distanceTo(anim1, anim2);

        if (distance <= anim1.width && distance <= anim1.height) {
            // removes the person on collision with another person.
            //removeanim1(anim1); //  event 
		   alert(" you have collision");
        }
};  


////////////////////////////////////////event function
//function removeanim1(anim1)
//{ anim[0]="pcWalk1.png";
//  anim1.img.src=anim[0];
//}
/////////////////////////////////////

</script>

</head>
<body onload="main();">
</body>
</html>

تم تعديل هذه المشاركة بواسطة ahmad123 في 18 أكتوبر 2010 في 21:06

#2

قمت بتجربة الكود على متصفح Firefox 3.6.10 دون وضع الصور.. وهو يعمل دون مشاكل mellow.gif

إنما الإسلام في الصحراء امـتهـد .... لـيـجـيء كــل مـســـلــمٍ أســـد

ليس كالمسلم في الخُلق أحــد .... ليس خلقُ اليوم، بل خلقُ الأبد

---------------------------------------

@AAlakkad

مدونتي

#3

لدي صورتين صحيح أريد أن يكون هناك اكتشاف للتصادم عندما تتصادم الصورتين و أريد أن يحدث افينت معين عند التصادم

أرجو أن تكون وضحت الصورة

تم تعديل هذه المشاركة بواسطة GProgrammer في 16 أكتوبر 2010 في 18:42

#4

السلام عليكم ورحمة الله

أخي الكريم هناك نقطتان بسيطتان لحل مشكلتك

الاولى :

أنك لم تقم باستدعاء checkForCollision() بأي مكان من الكود

فإما أن تقوم باستدعائها في update() ﻷنك قمت باستدعاءها في main() وبالتالي كلما تم تنفيذ update() سيتم تنفيذ checkForCollision()

أو يمكنك استدعائها مباشرة في الـ main() هذا إن كنت مثلا تريد استدعاءها بوقت مختلف عن update() و تسدعيها عندها بنفس طريقة استدعاء update()

الثانية :

بعد استدعاء checkForCollision() أيضا لن يعمل الكود بشكل صحيح

وذلك ﻷن هناك خطأ في هذه الـ function

والخطأ في هذا السطر :

if (distance <= anim1.width && distance <= anim1.height) {

الخطأ هو أن anim1.width هو undefined ليس للـ anim1 طول أو عرض و إنما الـ anim1.img هي التي لها طول و عرض

فاستبدل السطر السابق بهذا :

if (distance <= anim1.img.width && distance <= anim1.img.height) {

وسيعمل الكود بشكل جيد بإذن الله

بتوفيق الله..

تم تعديل هذه المشاركة بواسطة MoHaMMaD Pro في 16 أكتوبر 2010 في 21:59

1

Everything will be fine when we TALK LESS, DO MORE


#5

مشكور و ما قصرت اخوي يعطيك العاااااااااااااافية

مواضيع مشابهة