網頁解謎框架:puzzle

jopen 9年前發布 | 8K 次閱讀 puzzle 前端技術

這是一個網頁解謎開發框架,可以通過此框架快速開發屬于自己的網頁解謎游戲。頁面結構參考了Arthur's Online Riddle。目前用此框架開發過的網頁解謎游戲有創軟網頁解謎

目前共有兩種通關種類:a. URL; b. Password。

開辟關卡方法

  1. 拷貝template目錄下的tp.php文件到你自己決定路徑,并修改名字;
  2. 填寫關卡編號stage,下一關卡路徑next(選填),網頁title提示title(選填),通關密碼passwd(選填)等等。
$p = new puzzle(array(
  "stage" => 15,
  "next" => "/folder/stage.php",
  "title" => "Title Tip",
  "passwd" => "Password",
  "unicode" => "utf-8",
  "jsCode" => "alert('javascript');",
  "cssCode" => "#item{display:none;}",
));

  1. 編寫謎面。

puzzle參數詳解

  1. stage: 目前關卡編號,用于顯示在頁面告知解謎者。
  2. next: 下一頁面的地址,這里分為兩種:
    • 通過提交密碼通關,這里URL必須填寫用根域開始的相對目錄,使用根域相對路徑表示法,例如:/lang/ruby.php;
    • 通過URL方式通關,則根據需要填寫即可。
  3. title: 當需要在網頁的<title>標簽填寫提示語時,則設置該項;
  4. passwd: 選中第b種解謎方式時,則需要填寫該項,并且需配合模板中的密碼框提交密碼。注意不要刪除密碼檢查代碼:
if($p->check()) {  $p->next(); }

你也可以針對每個關卡編寫自己的檢查處理,當$p->check()等于true時,表示驗證通過。
5.unicode: 指定頁面編碼,用于特殊關卡。
6.jsCode: 設置頁面加載完成后執行的js代碼,此部分代碼不會直接出現在頁面中,而是過script標簽引用外部文件。 7.cssCode: 設置關卡的獨立css代碼,此部分代碼不會直接出現在頁面中,而是過link標簽引用外部文件。

部署須知

  • 網站需部署在根目錄或目錄要綁定(子)域

項目主頁:http://www.baiduhome.net/lib/view/home/1449385890775

 本文由用戶 jopen 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
 轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!