Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

滑塊拼圖遊戲 Sliding puzzle

465 views

Published on

這部分就是滑塊拼圖遊戲的教學。包括如何設定、進行遊戲、分享滑塊拼圖遊戲等操作。詳細內容可以看我寫的「你玩過滑塊拼圖嗎?可自訂的HTML5滑塊拼圖遊戲」這篇喔。
http://blog.pulipuli.info/2017/09/html5-customizable-sliding-puzzle-in.html

Published in: Education
  • Be the first to comment

  • Be the first to like this

滑塊拼圖遊戲 Sliding puzzle

  1. 1. 畫完圖片就來玩: 滑塊拼圖遊戲 Sliding Puzzle Part 4. 1
  2. 2. 2 滑塊拼圖 ●移動空格上下左右的方塊 ●以此重新組成原來的圖片
  3. 3. 3 滑塊拼圖遊戲 Image Puzzle ●純網頁的滑塊拼圖遊 戲 ●可自行選擇作為拼圖 的圖片(使用圖片網址) ●可分享到Facebook、 Line等社群媒體
  4. 4. 4 開啟滑塊拼圖遊戲 Image Puzzle 滑塊拼圖遊戲 ImagePuzzle https://pulipulichen.github.io/ Sliding-Puzzle/
  5. 5. 介面說明:設定畫面 5 A.選擇拼圖難度 B.開始遊戲的方式 1.輸入圖片網址 2.拖曳圖片到此 3.上傳圖片 4.範例圖片 (薑黃貓) A B
  6. 6. 介面說明: 遊戲畫面 6 B A C A.功能列 1.分享到FB 2.觀看目標圖片 3.重新挑戰 4.換一張圖 B.拼圖遊戲區:點 選來移動拼圖 C.分享工具
  7. 7. 7 滑塊拼圖遊戲 Image Puzzle 1.輸入圖片網址 2.分享滑塊拼圖遊戲
  8. 8. 8 1. 輸入圖片網址 貼上圖片網址 http://i67.tinypic.com/30hxxfq.jpg !
  9. 9. 9 開始拼圖遊戲囉
  10. 10. 10 2. 分享滑塊拼圖遊戲 !
  11. 11. 11 滑塊拼圖遊戲 Image Puzzle 上機囉!

×