ビッグカルーセル宝くじゲームの js 実装 example_javascript スキル-jsチュートリアル-php.cn

ホームページ

ウェブフロントエンド

jsチュートリアル

ビッグカルーセル宝くじゲームの js 実装 example_javascript スキル

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

May 16, 2016 pm 03:53 PM

js 大きなターンテーブル宝くじゲーム

この記事の例では、js を使用したビッグカルーセル宝くじゲームの実装について説明します。皆さんの参考に共有してください。具体的な実装方法は以下の通りです。

<!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>js抽奖</title>
 <style type="text/css">
  td{width:50px;height:50px;border:3px solid #ccc;text-align:center;vertical-align:middle}
 </style>
</head>
<body>
<table id="tb">
<tr>
 <td>1</td><td>2</td><td>3</td><td>4</td><td>5</td>
</tr>
<tr>
 <td>16</td><td></td><td></td><td></td><td>6</td>
</tr>
<tr>
 <td>15</td><td></td><td></td><td></td><td>7</td>
</tr>
<tr>
 <td>14</td><td></td><td></td><td></td><td>8</td>
</tr>
<tr>
 <td>13</td><td>12</td><td>11</td><td>10</td><td>9</td>
</tr>
</table>
<p></p>
请输入1-16其中一位整数，代表要停止的位置<input id="txtnum" value="12" type="text" /><input type="button" value="开始" onclick="StartGame()" />
 <script type="text/javascript">
  /*
  * 删除左右两端的空格
  */
  function Trim(str){
   return str.replace(/(^\s*)|(\s*$)/g, ""); 
  }
  /*
   * 定义数组
   */
  function GetSide(m,n){
   //初始化数组
   var arr = [];
   for(var i=0;i<m;i++){
    arr.push([]);
    for(var j=0;j<n;j++){
     arr[i][j]=i*n+j;
    }
   }
   //获取数组最外圈
   var resultArr=[];
   var tempX=0,
    tempY=0,
    direction="Along",
    count=0;
   while(tempX>=0 && tempX<n && tempY>=0 && tempY<m && count<m*n)
   {
    count++;
    resultArr.push([tempY,tempX]);
    if(direction=="Along"){
     if(tempX==n-1)
      tempY++;
     else
      tempX++;
     if(tempX==n-1&&tempY==m-1)
      direction="Inverse"
    }
    else{
     if(tempX==0)
      tempY--;
     else
      tempX--;
     if(tempX==0&&tempY==0)
      break;
    }
   }
   return resultArr;
  }
  var index=0,   //当前亮区位置
  prevIndex=0,   //前一位置
  Speed=300,   //初始速度
  Time,   //定义对象
  arr = GetSide(5,5),   //初始化数组
   EndIndex=0,   //决定在哪一格变慢
   tb = document.getElementById("tb"),  //获取tb对象 
   cycle=0,   //转动圈数 
   EndCycle=0,   //计算圈数
  flag=false,   //结束转动标志 
  quick=0;   //加速
  function StartGame(){
   cycle=0;
   flag=false;
   EndIndex=Math.floor(Math.random()*16);
   //EndCycle=Math.floor(Math.random()*4);
  EndCycle=1;
   Time = setInterval(Star,Speed);
  }
  function Star(num){
   //跑马灯变速
   if(flag==false){
    //走五格开始加速
    if(quick==5){
     clearInterval(Time);
     Speed=50;
     Time=setInterval(Star,Speed);
    }
    //跑N圈减速
    if(cycle==EndCycle+1 && index==EndIndex){
    clearInterval(Time);
     Speed=300;
     flag=true;   //触发结束
     Time=setInterval(Star,Speed);
    }
   }
   if(index>=arr.length){
    index=0;
    cycle++;
   }
   //结束转动并选中号码
   if(flag==true && index==parseInt(Trim(document.getElementById("txtnum").value))-1){ 
   quick=0;
   clearInterval(Time);
   }
   tb.rows[arr[index][0]].cells[arr[index][1]].style.border="3px solid red";
   if(index>0)
    prevIndex=index-1;
   else{
    prevIndex=arr.length-1;
   }
   tb.rows[arr[prevIndex][0]].cells[arr[prevIndex][1]].style.border="3px solid #ccc";
   index++;
   quick++;
  }
  /*
  window.onload=function(){
   Time = setInterval(Star,Speed);
  }
  */
 </script>
</body>
</html>

ログイン後にコピー

この記事が皆様の JavaScript プログラミング設計に役立つことを願っています。

このウェブサイトの声明

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Video Face Swap

完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

ホットトピック

Gmailメールのログイン入り口はどこですか？

7751

Java チュートリアル

1643

CakePHP チュートリアル

1397

Laravel チュートリアル

1293

PHP チュートリアル

1234

Related knowledge

Nvgpucomp64.dll は Windows PC ゲームをクラッシュさせます。 Mar 26, 2024 am 08:20 AM

Nvgpucomp64.dll が原因でゲームが頻繁にクラッシュする場合は、ここで提供される解決策が役立つ可能性があります。この問題は通常、グラフィックカードドライバーが古いか破損していること、ゲームファイルが破損していることなどが原因で発生します。これらの問題を修正すると、ゲームのクラッシュに対処するのに役立ちます。 Nvgpucomp64.dll ファイルは、NVIDIA グラフィックスカードに関連付けられています。このファイルがクラッシュすると、ゲームもクラッシュします。これは通常、LordsofttheFallen、LiesofP、RocketLeague、ApexLegends などのゲームで発生します。 N の場合、Nvgpucomp64.dll が Windows PC 上のゲームをクラッシュさせる

NVIDIA が RTX HDR 機能を開始: サポートされていないゲームは AI フィルターを使用して HDR の豪華な視覚効果を実現します Feb 24, 2024 pm 06:37 PM

2 月 23 日のこの Web サイトのニュースによると、NVIDIA は昨夜 NVIDIA アプリケーションを更新してリリースし、プレイヤーに新しい統合 GPU コントロールセンターを提供し、プレイヤーはゲーム内フローティングによって提供される強力な記録ツールを通じて素晴らしい瞬間をキャプチャできるようになりました。窓。このアップデートでは、NVIDIA も RTXHDR 機能を導入しました。公式の紹介文はこのサイトに添付されています: RTXHDR は、ハイダイナミックレンジ (HDR) のゴージャスな視覚効果をゲームにシームレスに導入できる、AI を活用した新しいフリースタイルフィルターです。もともとHDRをサポートしています。この機能をさまざまな DirectX および Vulkan ベースのゲームで使用するには、HDR 互換モニターが必要です。プレーヤーが RTXHDR 機能を有効にすると、HD をサポートしていなくてもゲームが実行されます。

スーパーピープルゲームのダウンロードとインストール方法の紹介 Mar 30, 2024 pm 04:01 PM

superpeople ゲームは、steam クライアントを通じてダウンロードできます。このゲームのサイズは約 28G です。ダウンロードとインストールには通常 1 時間半かかります。ここでは、具体的なダウンロードとインストールのチュートリアルを紹介します。グローバルクローズドテストへの新しい申請方法 1) Steamストア(Steamクライアントダウンロード)で「SUPERPEOPLE」を検索 2) 「SUPERPEOPLE」ストアページ下部にある「SUPERPEOPLEクローズドテストへのアクセスをリクエスト」をクリック 3) request accessボタン、Steamライブラリで「SUPERPEOPLECBT」ゲームが確認できます 4)「SUPERPEOPLECBT」内のインストールボタンをクリックしてダウンロード

win11のスパイダーソリティアはどこにありますか win11でスパイダーソリティアゲームをプレイする方法 Mar 01, 2024 am 11:37 AM

AAA の傑作やモバイルゲームを十分にプレイした友人の皆さん、子供の頃のコンピューターゲームを追体験してみませんか?それでは、Windows 11 のスパイダーソリティアを一緒に探してみましょう!インターフェイスの [スタート] メニューをクリックし、[すべてのアプリ] ボタンをクリックし、[すべてのアプリ] をクリックします。 Microsoft のソリティアシリーズゲームアプリケーションである「MicrosoftSolitaireCollection」を見つけて選択します; ソリティアシリーズゲームの選択。ロードが完了したら、選択インターフェイスに入り、「スパイダーソリティア」を見つけて、「スパイダーソリティア」を選択します。インターフェースは若干変更されていますが、以前と同じです。

ASUS、Intelの第13/14世代プロセッサーでのゲームの安定性を向上させるBIOSアップデートをリリース Apr 20, 2024 pm 05:01 PM

4月20日の当サイトのニュースによると、ASUSは最近、Intelの第13/14世代プロセッサでゲームを実行する際のクラッシュなどの不安定性を改善するBIOSアップデートをリリースしたとのこと。同サイトは以前、バンダイナムコの格闘ゲーム「鉄拳8」のPCデモ版を実行すると、コンピュータに十分なメモリとビデオメモリがある場合でもシステムがクラッシュし、メモリ不足を示すエラーメッセージが表示されるなどの問題がプレイヤーから報告されたと報告していた。同様のクラッシュの問題は、「バトルフィールド 2042」、「レムナント 2」、「フォートナイト」、「ロードオブザフォールン」、「ホグワーツレガシー」、「ザファイナル」などの多くのゲームでも発生しています。 RADは今年2月に長い記事を公開し、ゲームクラッシュの問題はBIOS設定、高いクロック周波数、Intelプロセッサの高い消費電力の組み合わせであると説明した。

推奨: 優れた JS オープンソースの顔検出および認識プロジェクト Apr 03, 2024 am 11:55 AM

顔の検出および認識テクノロジーは、すでに比較的成熟しており、広く使用されているテクノロジーです。現在、最も広く使用されているインターネットアプリケーション言語は JS ですが、Web フロントエンドでの顔検出と認識の実装には、バックエンドの顔認識と比較して利点と欠点があります。利点としては、ネットワークインタラクションの削減とリアルタイム認識により、ユーザーの待ち時間が大幅に短縮され、ユーザーエクスペリエンスが向上することが挙げられます。欠点としては、モデルサイズによって制限されるため、精度も制限されることが挙げられます。 js を使用して Web 上に顔検出を実装するにはどうすればよいですか? Web 上で顔認識を実装するには、JavaScript、HTML、CSS、WebRTC など、関連するプログラミング言語とテクノロジに精通している必要があります。同時に、関連するコンピュータービジョンと人工知能テクノロジーを習得する必要もあります。 Web 側の設計により、次の点に注意してください。

Little Black Box から購入したゲームを Steam に追加する方法 Feb 23, 2024 pm 05:30 PM

小さな黒い箱にはさまざまなゲームが購入できますが、購入したゲームをSteamに追加するにはどうすればよいですか?ユーザーは、Steam で Steam 上で製品をアクティベートし、小さな黒いボックス内のアクティベーションコードをコピーしてアクティベートする必要があります。購入したゲームを Steam に保存する方法のこの紹介では、具体的な方法を説明します。以下は詳細な紹介です。急いで見に来てください！ Little Black Box から購入したゲームを Steam に追加する方法回答: Steam で Steam 上で製品をアクティベートしてウェアハウスに追加します具体的な方法: 1. まず、Steam 上のゲームボタンをクリックします。 2. 「Steam で製品をアクティベートする」をクリックします。 3. 表示されるウィンドウで「次へ」をクリックします。 4. 製品アクティベーションの小さな黒いボックスに購入コードを貼り付けます。 5. 次に、「次へ」をクリックして追加します

iPadでゲームをすると音が出なくなるのはなぜですか? Feb 20, 2024 am 08:24 AM

iPad でゲームをプレイするときに音が出ない考えられる原因 iPad をゲームエンターテイメントに使用しているとき、突然音が出なくなると非常にイライラします。静かなゲーム体験は間違いなく楽しみを大幅に減らし、人々を混乱させ、不満を感じさせます。では、iPad でゲームをプレイするときに音が出ない問題が発生した場合、考えられる原因は何でしょうか?この記事では、そのような問題の考えられる原因を分析して解決します。音量設定が間違っているまず、iPad の音量設定を確認する必要があります。 iPad の側面または上部にある物理ボタンは、

See all articles

ビッグカルーセル宝くじゲームの js 実装 example_javascript スキル

ホットAIツール

Undresser.AI Undress

AI Clothes Remover

Undress AI Tool

Clothoff.io

Video Face Swap

人気の記事

ホットツール

メモ帳++7.3.1

SublimeText3 中国語版

ゼンドスタジオ 13.0.1

ドリームウィーバー CS6

SublimeText3 Mac版

ホットトピック