使用PHP/Javascript實現網絡遊戲？

Question

我需要一些關於如何從這一開始的建議。我的最終目標是製作一些視覺上令人驚歎的輪子，它可以旋轉一組圖片並隨機停在某張圖片上，並在輪子的中心顯示一些文字。隨着AJAX庫的數量的增加，我很確定有人必須做類似的事情。有沒有人有我可以用來開始這件事的參考？

首選平臺：PHP和JavaScript

任何修改，同時保留的屬性（圖像隨機化，一些相關聯的文本顯示，視覺衝擊力），歡迎以及..

Answer 1

基本你不能決定在哪裏停在客戶端。所以你不能在javascript中使用隨機函數。 您必須使用PHP在服務器端生成隨機變量，然後在瀏覽器中使用動畫來顯示滾動效果。

的滾動效果（入世複雜的順序）

解決方法1：使用GIF

創建兩個圖片一個旋轉的GIF另一個靜態。 在第一顯示器旋轉GIF然後用靜態GIF 取代它讓圖像是rot.gif和static.gif

<img src="rot.gif" id="replaceMe" /> 

將呈rorating圖片。 現在使用JavaScript來取代它

<script> 
function replace() { 
var replaceMe = document.getElementById('replaceMe'); 
replaceMe.src = "static.gif"; 
} 

// Call the function after 20 Sec so that use will get time to see a rotating image 
setTimeout('replace()'); 
</script> 

解決方法2：在上面的CSS類

.rot90 { 
-webkit-transform: rotate(90deg); 
-moz-transform: rotate(90deg); 
rotation: 90deg; 
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1); 
} 

看使用CSS。它將圖像旋轉90度。 現在您可以使用Javascript訪問CSS樣式。 所以你需要一個靜態的輪子圖像，而JavaScript將完成剩下的工作。 那麼我不知道如何修改filter：progid：DXImageTransform.Microsoft.BasicImage（rotation = 1）; -moz-transform：rotate（90deg）;和-webkit-transform：rotate（90deg）;使用javascript 但旋轉：90deg;可以很容易地修改。 你需要做一些功課，找出修改其他值。 這是一個只有旋轉css選擇器的解決方案。

你需要一個圖像<img src="wheel.gif" id="rotateMe" />會做。

<script> 
var rotateMe; 
rotateMe = document.getElementById('rotateMe'); 

var currentAngle; 
currentAngle = 0; 

function incrementAngle() { 
currentAngle = currentAngle + 1; 
if (currentAngle == 360) { 
currentAngle = 0; 
} 
} 

function rotate() { 
rotateMe.style.rotation = currentANgle + "deg"; 
incrementAngle(); 
} 

var timerId; 
timerId = setInterval("rotate()", 200); // Increase or decrease number to inc/dec speed 

function stopTimer() { 
clearInterval(timerId); 
} 

setTimeout(stopInterval(), 30000); // Stop rotating after 30 sec 
</script>