»
AnglaisFrançaisVietnamien

Imprimer - DHTML Pong script - JavaScriptBank.com

Version complète: jsB@nk » Game » Qualification » DHTML Pong script
URL: https://www.javascriptbank.com/dhtml-pong-script.html

DHTML Pong script © JavaScriptBank.comPhong est un incroyable jeu de ping-pong avec un encore plus impressionnant AI (intelligence artificielle). Jouez contre l'ordinateur, et voyez si vous pouvez gagner (le prendre pour nous, c'est possible). Nous encourageons les programmeurs DHTML pour vérifier la source pour voir comment gérer cette impressionnante Michael feat DHTML ...

Version complète: jsB@nk » Game » Qualification » DHTML Pong script
URL: https://www.javascriptbank.com/dhtml-pong-script.html



CSS
<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><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


JavaScript
<script type="text/javascript">/************************************************ DHTML Phong script- © nathan (http://www.n-son.com/)***********************************************/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><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<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><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->