Forum'da ara:
Ara


« Önceki başlık :: Sonraki başlık »  
Yazar Mesaj
Mesaj02.05.2009, 08:54 (UTC)    
Mesaj konusu: Basit ama zevkli bir oyun

Kod:
<!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">
<head>
<title>DHTMLPong</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<style type="text/css">
#pongTable {
   position: absolute;
   top: 20px;
   left: 20px;
   width: 400px;
   height: 300px;
   border: 4px solid #CCC;
   background-color: #F3F3F3;
   z-index: 1;
}
#playerOne {
   position: absolute;
   top: 196px;
   left: 45px;
   width: 10px;
   height: 35px;
   background-color: #777;
   z-index: 2;
}
#playerTwo {
   position: absolute;
   top: 196px;
   left: 390px;
   width: 10px;
   height: 35px;
   background-color: #777;
   z-index: 2;
}
#ball {
   position: absolute;
   top: 160px;
   left: 210px;
   width: 7px;
   height: 7px;
   clip: rect(0px 7px 7px 0px);
   background-color: #555;
   z-index: 2;
   display: none;
}
#click {
   position: absolute;
   top: 160px;
   left: 27px;
   width: 400px;
   text-align: center;
   font-family: Tahoma;
   font-size: 10px;
   z-index: 3;
}
#scores {
   position: absolute;
   top: 330px;
   left: 24px;
   width: 400px;
   font-family: Tahoma;
   font-size: 11px;
   z-index: 3;   
}
</style>

<script type="text/javascript">

/***********************************************
* DHTML Phong script- © nathan (http://www.n-son.com/)
* Permission granted to DynamicDrive.com to feature script
* This notice must stay intact for use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

var ballAng;
var speed = 3;
var ping = 5;
var pong = 0;
var mouseSpeed;
var tempY;
function init() {
   document.getElementById("click").style.display = "none";
   document.getElementById("ball").style.display = "inline";
   with( document.getElementById("ball").style ) {
      top = "160px";
      left = "210px";
   }
   document.onmouseup = null;
   document.onmousemove = movePaddle;
   ballAng = Math.round( Math.random() * 100 ) + 130;
   moveDaBall = setInterval("moveBall()", 10);
}
function movePaddle(e) {
   e = (e)?e:event;
   if( tempY ) {
      mouseSpeed = Math.round((e.clientY - tempY) * 1.5);
      if( mouseSpeed == 0 ) mouseSpeed = 1;
   }
   with( document.getElementById("playerOne").style ) {
      top = e.clientY - 18 + "px";
      if( parseInt(top) < 24 || parseInt(top) > 289 ) {
         if( parseInt(top) < 24 ) {
            top = "24px";
         } else {
            top = "289px";
         }
      }
   }
   tempY = e.clientY;
}
function moveBall() {
   var ballX = parseInt(document.getElementById("ball").style.left);
   var ballY = parseInt(document.getElementById("ball").style.top);
   var playOneX = parseInt( document.getElementById("playerOne").style.left );
   var playOneY = parseInt( document.getElementById("playerOne").style.top );
   var playTwoX = parseInt( document.getElementById("playerTwo").style.left );
   var playTwoY = parseInt( document.getElementById("playerTwo").style.top );
   if( ballY >= (playOneY - 5) && ballY <= (playOneY + 35 + 5) && ballX >= playOneX && ballX <= (playOneX + 10) ) {
      if( pong == 3 ) {
         ping++;
         pong = 0;
      } else {
         pong++;
      }
      document.getElementById("ball").style.left = playOneX + 10 + "px";
      ballAng = 180 - ballAng - mouseSpeed;
   }
   if( ballY >= (playTwoY - 5) && ballY <= (playTwoY + 35 + 5) && ballX >= playTwoX && ballX <= (playTwoX + 10) ) {
      if( pong == 3 ) {
         ping++;
         pong = 0;
      } else {
         pong++;
      }
      document.getElementById("ball").style.left = playTwoX + "px";
      ballAng = 180 - ballAng;
   }
   if( ballY < 25 || ballY > 316 ) {
      document.getElementById("ball").style.top = (ballY < 25)?25+"px":316+"px";
      ballAng = 360 - ballAng;
   }
   if( ballX <= 24 || ballX >= 417 ) {
      document.getElementById("ball").style.left = (ballX <=24)?24+"px":417+"px";
      if( ballX<= 24 ) {
         endPoint(document.getElementById("twoScore"));
      } else {
         endPoint(document.getElementById("oneScore"));
      }
   }
   moveAI( ballY );
   moveObjAtAngle( document.getElementById("ball"), ballAng, ping);
}
function moveObjAtAngle( obj, ang, dist ) {
   with( obj.style ) {
      left = parseInt(left) + ( dist * Math.cos( ang * (Math.PI/180) ) ) + "px";
      top  = parseInt(top)  - ( dist * Math.sin( ang * (Math.PI/180) ) ) + "px";
   }
}
function moveAI( y ) {
   var AI = document.getElementById("playerTwo");
   y = y - 10;
   y = parseInt(AI.style.top) + ((y - parseInt(AI.style.top)) / speed);
   if( y < 24 || y > 289 ) {
      if( y < 24 ) {
         y = 24;
      } else {
         y = 289;
      }
   }
   AI.style.top = y +"px";
}
function endPoint(place) {
   clearInterval(moveDaBall);
   ping = 7;
   pong = 0;
   document.onmouseup = init;
   document.getElementById("click").innerHTML = "click to continue";
   place.innerHTML = parseInt(place.innerHTML) + 1;
   if( parseInt(place.innerHTML) == 10 ) {
      if( place.id == "oneScore" ) {
         endGame(1);
      } else {
         endGame(0);
      }
   }
   document.getElementById("click").style.display = "inline";
}
function endGame(win) {
   document.onmouseup = restartGame;
   if( win ) {
      document.getElementById("click").innerHTML = "<strong>you are dah winnah!</strong><br /> click to start over";
   } else {
      document.getElementById("click").innerHTML = "<strong>you are dah losah!</strong><br /> click to start over";
   }
}
function restartGame() {
   document.getElementById("oneScore").innerHTML = 0;
   document.getElementById("twoScore").innerHTML = 0;
   init();
}
document.onmouseup = init;
</script>


</head>
<body>

<div id="pongTable">
   <div style="float: right; width: 50%; height: 100%; border-left: 2px dashed #DDD;"> </div>
</div>
<div id="playerOne" style="left: 45px; top: 146px"> </div>
<div id="playerTwo" style="left: 390px; top: 146px"> </div>
<div id="ball" style="left: 210px; top: 160px"> </div>
<div id="click">click to continue</div>
<div id="scores">
   <span style="float: left;" id="oneScore">0</span>
   <span style="float: right;" id="twoScore">0</span>
</div>

</body>
</html>

______________
Mesaj02.05.2009, 09:52 (UTC)    
Mesaj konusu:

güzel
Mesaj21.07.2009, 16:52 (UTC)    
Mesaj konusu:

sağolasın
Önceki mesajları göster:   


Powered by phpBB © 2001, 2005 phpBB Group
Türkçe Çeviri: phpBB Türkiye & Erdem Çorapçıoğlu