index.html 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436
  1. <!DOCTYPE HTML>
  2. <html>
  3. <head>
  4. <meta charset="utf-8" />
  5. <title>疯狂猜水果</title>
  6. <meta content="telephone=no" name="format-detection"/>
  7. <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
  8. <link type="text/css" href="./styles/style.css" rel="stylesheet">
  9. <meta name="apple-mobile-web-app-capable" content="yes"/>
  10. <meta content="black" name="apple-mobile-web-app-status-bar-style">
  11. <meta name="browsermode" content="application"/>
  12. <link rel="stylesheet" type="text/css" href="css/game9g.css">
  13. <script src="js/game9g.js"></script>
  14. <style>
  15. #J_game_end{
  16. display:none;
  17. }
  18. </style>
  19. </head>
  20. <body>
  21. <div class="section" id="J_game">
  22. <div class="game-menu clearfix">
  23. <div class="game-menu-l">
  24. 六六36关,第<span id="J_level_num">1</span>关
  25. </div>
  26. </div>
  27. <div id="J_game_main">
  28. <div class="game-main" id="J_game_m">
  29. <div class="game-fruits-img">
  30. <img id="J_fruits_img" />
  31. </div>
  32. <div class="game-stop-popup">?</div>
  33. <div class="game-bg"></div>
  34. </div>
  35. <div class="game-answer" id="J_answer"></div>
  36. <div class="game-help">
  37. <div class="ui-btn J_share_h">向朋友圈求助</div>
  38. </div>
  39. </div>
  40. </div>
  41. <div class="section" id="J_game_end">
  42. <div class="game-res">
  43. <p>哟喂,你认出了<span class="game-res-num" id="J_fruits_num"></span>种水果,</p>
  44. <p style="font-size:22px;">惊动了水果学界</p>
  45. <div><div class="game-res-share ui-btn" onClick="playagain();">再玩一次</div></div>
  46. <div><div class="game-res-share ui-btn" onClick="dp_share();">炫耀我的战绩</div></div>
  47. <div class="game-res-arrow"></div>
  48. </div>
  49. <div class="game-res-gz">
  50. <p>离“满脸羞涩的花姑娘”还有最后一<br />步,赶快去抢!</p>
  51. <div><a href="#" onClick="clickMore();" class="game-res-gz-btn ui-btn">抢花姑娘</a></div>
  52. </div>
  53. </div>
  54. <footer id="J_footer">
  55. <a href="#" onClick="clickMore();">关注空中传媒</a>
  56. </footer>
  57. <div class="share-popup" id="J_share_popup" style="z-index:98;"></div>
  58. <div class="share-popup-tips" id="J_share_popup_t" style="z-index:99;">
  59. <i></i>
  60. <span id="J_share_cont">分享到朋友圈</span>
  61. </div>
  62. <script type="text/javascript" src="js/zepto.min.js"></script>
  63. <script type="text/javascript">
  64. (function(){
  65. //游戏状态 0:未开始 1:游戏中 2:游戏结束 3:游戏完成
  66. var game_status = 0;
  67. //游戏时间 毫秒
  68. var game_time = 60000;
  69. //时间
  70. var timer = "";
  71. //水果名称
  72. var fruits_name = "";
  73. //背景随机颜色
  74. var bg_color = ["#9ff", "#ffc", "#cfc", "#f99", "#fcf", "#cff", "#fcc", "#98e2f1"];
  75. //默认背景颜色
  76. var def_bg_color = "#98e2f1";
  77. //问题等级
  78. var level = [0, 13, 38, 78, 194];
  79. //每关问题数,最后等级为所有问题
  80. var pre_level_num = [18, 36];
  81. //每个关卡对应问题答案数
  82. var pre_level_ans_num = [4, 6];
  83. //游戏等级
  84. var game_level = 0;
  85. //游戏关数
  86. var game_num = 1;
  87. //问题索引
  88. var ques_index = "";
  89. //图片索引
  90. var img_index = "";
  91. //分享
  92. var share_type = "游戏页好友分享";
  93. var share_type_p = "游戏页朋友圈分享";
  94. var share_desc = "这个水果叫什么?快来一起玩猜水果,抢东北花姑娘!";
  95. var share_url = "http://weixinad.lejuy.com/game/fkcsg/";
  96. var mebtnopenurl = 'http://weixinad.lejuy.com/game.html';
  97. var guanzhuurl ="http://t.cn/RPtNrve";
  98. var share_img = "http://file1.wisetravel.cn/file/games/fruits/images/share_icon.png";
  99. $("#J_replay").on("tap", function(){
  100. game.start_game();
  101. $("#J_game_status").find("span").removeClass("stop");
  102. $("#J_game_status").attr("data-stop", 0).html("<span>暂停</span>");;
  103. });
  104. $("#J_continue_game").on("tap", function(){
  105. game.continue_game();
  106. $("#J_game_status").attr("data-stop", 0).html("<span>暂停</span>");
  107. });
  108. $("#J_game_status").on("tap", function(){
  109. var is_stop = $(this).attr("data-stop");
  110. if(is_stop == 1){
  111. game.continue_game();
  112. $(this).attr("data-stop", 0).html("<span>暂停</span>");
  113. }else{
  114. game.stop_game();
  115. $(this).attr("data-stop", 1).html("<span class='stop'>继续</span>");
  116. }
  117. });
  118. $("#J_skip_share").on("tap", function(){
  119. $("#J_share_popup").show();
  120. $("#J_share_popup_t").show();
  121. });
  122. $(".J_share_h").on("tap", function(){
  123. $("#J_share_popup").show();
  124. $("#J_share_popup_t").show();
  125. $("#J_share_cont").html("不认识它?<br />向朋友求助");
  126. game.stop_game();
  127. });
  128. $("#J_share_popup").on("tap", function(){
  129. $(this).hide();
  130. $("#J_share_popup_t").hide();
  131. });
  132. $("#J_share_popup_t").on("tap", function(){
  133. $(this).hide();
  134. $("#J_share_popup").hide();
  135. });
  136. var game = {
  137. question_list : [],
  138. ques_game_num : 1,
  139. ques_game_index : 0,
  140. right_num : 0,
  141. is_ansing : 0,
  142. //开始游戏
  143. start_game : function(){
  144. //初始化参数
  145. clearInterval(timer);
  146. game_time = 60000;
  147. game_status = 1;
  148. pre_level_num = [18, 36];
  149. game_level = 0;
  150. level = [0, 13, 38, 78, 194];
  151. game_num = 1;
  152. game.ques_game_num = 1;
  153. game.question_list = [];
  154. fruits_name = [["桂圆", 37], ["佛手果", 67], ["椰子", 22], ["石榴", 9], ["菠萝莓", 82], ["枇杷", 14], ["海棠果", 13], ["金桔", 23], ["西番莲", 94], ["菠萝", 8], ["樱桃", 11], ["荸荠", 17], ["菇娘", 26], ["杨桃", 16], ["苹婆", 64], ["荔枝", 36], ["乌鲁库", 78], ["蓝莓", 68], ["山竹", 136], ["青梅", 31], ["槟榔子", 33], ["人参果", 97], ["桑葚", 107], ["红毛丹", 140], ["九月炸", 44], ["凉薯", 46], ["杨梅", 49], ["木瓜", 148], ["莲雾", 80], ["菠萝蜜", 86], ["五月茶", 90], ["柚子", 7], ["无花果", 27], ["蒲桃", 71], ["蔓越莓", 102], ["塞舌尔海椰子", 103]];
  155. //是否为求助页面
  156. var help_hash = window.location.hash.replace(/^#/, "");
  157. if(help_hash != "" && typeof fruits_name[help_hash] !== "undefined"){
  158. var tmp_fruits_game = fruits_name[help_hash];
  159. fruits_name[help_hash] = fruits_name[0];
  160. fruits_name[0] = tmp_fruits_game;
  161. }
  162. share_type = "游戏求助好友分享";
  163. share_type_p = "游戏求助朋友圈分享";
  164. $("#J_level_num").html(game_num);
  165. game.lazy_load_img();
  166. game.select_ques();
  167. footer_bot();
  168. },
  169. //选问题
  170. select_ques : function(){
  171. //随机水果名
  172. var fruits_name_rand = ["虹之玉","子持果","绿之玲","白牡丹","桃美人","黑法师","女心果","熊童实","姬星美人","吉娃娃果","黑王子","紫果丹","玉珠帘","宝石果","紫珍珠","碧玉莲","绒绢莓","唐莓","玉露黄","大和锦","姬麒麟","鬼切芦荟","吉祥果","帝释天荔枝","佛手掌","青鸾果","神风玉","天女簪","仙宝果","龙骨角","魔玉果","龙角果","紫龙角","巨龙角","阿修罗果","佛头瓜","铁锡柚","念珠瓜","七宝果","蛮鬼果","盘叶莲花枣","轮回莓","长生果","伽蓝果","钟鬼果","万物想桃","白蔓莲橙","碧雷鼓橙","龙树之眼","阿修罗果","九头龙柿","达摩卧桃","姬红小杏","橙黄松叶枣","初鹰之恋","千兔瓜","月兔瓜","丽春玉","百惠果","喷炎龙果","喷火龙果","豆瓣绿提子","趣蝶莲柠檬","短叶神刀果"];
  173. var ans_name = [["桂圆", 38], ["佛手果", 68], ["椰子", 23], ["石榴", 10], ["菠萝莓", 83], ["枇杷", 15], ["海棠果", 14], ["金桔", 24], ["西番莲", 95], ["菠萝", 9], ["樱桃", 12], ["荸荠", 18], ["菇娘", 27], ["杨桃", 17], ["苹婆", 65], ["荔枝", 37], ["乌鲁库", 79], ["蓝莓", 69], ["山竹", 137], ["青梅", 32], ["槟榔子", 34], ["人参果", 98], ["桑葚", 108], ["红毛丹", 141], ["九月炸", 45], ["凉薯", 47], ["杨梅", 50], ["木瓜", 149], ["莲雾", 81], ["菠萝蜜", 87], ["五月茶", 91], ["柚子", 8], ["无花果", 28], ["蒲桃", 72], ["蔓越莓", 103], ["塞舌尔海椰子", 104]];
  174. ans_name[game_num - 1] = ans_name[ans_name.length - 1];
  175. ans_name.pop();
  176. if(game_num <= pre_level_num[0]){
  177. var l = 0;
  178. }else if(game_num <= pre_level_num[1]){
  179. var l = 1;
  180. $("#J_answer").addClass("game-answer1");
  181. }else{
  182. gameOver(game.right_num);
  183. return false;
  184. }
  185. var question = game.question_list.shift();
  186. game.lazy_load_img();
  187. img_index = question[question.length - 1] + 1;
  188. question.pop();
  189. $("#J_fruits_img").attr("src", "images/fruits/"+ img_index +".jpg");
  190. var ans_html = "";
  191. var right_ans_i = Math.floor(Math.random() * pre_level_ans_num[l]);
  192. var right_ans = question.shift();
  193. //随机答案处理
  194. var new_question = [];
  195. var is_fruits_name_rand = 0;
  196. for(var i = 0; i < pre_level_ans_num[l]; i++){
  197. var rand_ques = Math.ceil(Math.random() * 100);
  198. if(i == right_ans_i){
  199. new_question.push(right_ans);
  200. }else if(rand_ques < 30 || is_fruits_name_rand == 1){
  201. var rand_index = Math.floor(Math.random() * ans_name.length);
  202. new_question.push(ans_name[rand_index][0]);
  203. ans_name[rand_index] = ans_name[ans_name.length - 1];
  204. ans_name.pop();
  205. }else{
  206. var rand_index = Math.floor(Math.random() * fruits_name_rand.length);
  207. new_question.push(fruits_name_rand[rand_index]);
  208. fruits_name_rand[rand_index] = fruits_name_rand[fruits_name_rand.length - 1];
  209. fruits_name_rand.pop();
  210. is_fruits_name_rand = 1;
  211. }
  212. }
  213. for(var i = 0; i < pre_level_ans_num[l]; i++){
  214. if(i == right_ans_i){
  215. ans_html += '<span class="game-an-btn ui-btn" data-ans="1">'+ new_question[i] +'<i></i></span>';
  216. }else{
  217. ans_html += '<span class="game-an-btn ui-btn" data-ans="0">'+ new_question[i] +'<i></i></span>';
  218. }
  219. }
  220. $("#J_answer").html(ans_html);
  221. $("body").css({
  222. background : bg_color[Math.floor(Math.random() * bg_color.length)]
  223. });
  224. footer_bot();
  225. },
  226. //回答
  227. answer : function(){
  228. $("#J_answer span").live("tap", function(){
  229. if(game.is_ansing == 1){
  230. return false;
  231. }
  232. game.is_ansing = 1;
  233. var is_ans = $(this).attr("data-ans");
  234. var that = $(this);
  235. if(is_ans == 1){
  236. $(this).addClass("right-btn");
  237. game.right_num++;
  238. }else{
  239. $(this).addClass("error-btn");
  240. $("#J_answer span").each(function(){
  241. if( $(this).attr("data-ans") == 1){
  242. $(this).addClass("right-btn");
  243. return false;
  244. }
  245. });
  246. }
  247. var ans_timer = setTimeout(function(){
  248. game_num++;
  249. $("#J_level_num").html(game_num);
  250. game.select_ques();
  251. game.is_ansing = 0;
  252. }, 500);
  253. });
  254. },
  255. //图片预加载
  256. lazy_load_img : function(){
  257. var laod_img_num = 6;
  258. if(game.question_list.length < laod_img_num && game_level < 36){
  259. var len = laod_img_num - game.question_list.length;
  260. for(var i = 0; i < len; i++){
  261. //问题随机数
  262. var question = fruits_name[game_level];
  263. game.question_list.push(question);
  264. game.load_img("images/fruits/"+ (question[question.length - 1] + 1) +".jpg");
  265. game_level++;
  266. }
  267. }
  268. },
  269. load_img : function(url, cb){
  270. var img = "";
  271. delete img.onload;
  272. img = new Image();
  273. img.onload = function(){
  274. (function(img){
  275. cb && cb(img);
  276. })(img);
  277. img.onload = null;
  278. };
  279. img.src = url;
  280. }
  281. };
  282. game.start_game();
  283. game.answer();
  284. //底部自适应
  285. function footer_bot(){
  286. $("#J_footer").css({
  287. position : "static"
  288. });
  289. var win_height = $(window).height();
  290. var body_height = $("body").height();
  291. if(win_height > body_height - 30){
  292. $("#J_footer").css({
  293. position : "absolute"
  294. });
  295. }
  296. }
  297. footer_bot();
  298. $(window).on("resize", function(){
  299. footer_bot();
  300. });
  301. })();
  302. //称号
  303. var fruits_nick_name = ["水果爱好者", "水果学霸", "水果学者", "水果学家", "水果大师"];
  304. function gameOver(game_num){
  305. $('#J_game').hide();
  306. $('#J_game_end').show();
  307. $("#J_fruits_num").html(game_num);
  308. var share_desc;
  309. if(game_num <= 10){
  310. $("#J_fruits_nick").html("哟喂,你认出了"+ game_num +"种水果,惊动了水果学界!");
  311. share_desc = "哟喂,我是"+ fruits_nick_name[0] +",对世界上"+ game_num +"种水果认识很深!";
  312. }else if(game_num > 10 && game_num <= 18){
  313. $("#J_fruits_nick").html("哇塞,你认出了"+ game_num +"种水果,震精了水果学界!");
  314. share_desc = "哇塞,我是"+ fruits_nick_name[1] +",对世界上"+ game_num +"种水果都了然如胸!";
  315. }else if(game_num > 18 && game_num <= 25){
  316. $("#J_fruits_nick").html("矮油,你认出了"+ game_num +"种水果,震撼了水果学界!");
  317. share_desc = "矮油,我是"+ fruits_nick_name[2] +",对世界上"+ game_num +"种水果都滚瓜烂熟!";
  318. }else if(game_num > 25 && game_num <= 31){
  319. $("#J_fruits_nick").html("我擦,你认出了"+ game_num +"种水果,惊颤了水果学界!");
  320. share_desc = "我擦,我是"+ fruits_nick_name[3] +",对世界上"+ game_num +"种水果都知之甚深!";
  321. }else{
  322. $("#J_fruits_nick").html("买噶,你认出了"+ game_num +"种水果,惊呆了水果学界! ");
  323. share_desc = "买噶,我是"+ fruits_nick_name[4] +",对世界上"+ game_num +"种水果都明察秋毫!";
  324. }
  325. dp_submitScore(game_num,share_desc);
  326. }
  327. function playagain(){
  328. window.location.href=window.location.href;
  329. }
  330. </script>
  331. <script language=javascript>
  332. var game9g = new Game9G("fkcsg");
  333. game9g.shareData.title = "疯狂猜水果";
  334. game9g.shareData.content = "疯狂猜水果";
  335. function goHome(){
  336. window.location=game9g.homeurl;
  337. }
  338. function clickMore(){
  339. if((window.location+"").indexOf("f=zf",1)>0){
  340. window.location = game9g.gzurl;
  341. }
  342. else{
  343. goHome();
  344. }
  345. }
  346. function dp_share(){
  347. game9g.share();
  348. }
  349. function dp_Ranking(){
  350. window.location=game9g.homeurl;
  351. }
  352. function showAd(){
  353. }
  354. function hideAd(){
  355. }
  356. function dp_submitScore(score,stitle){
  357. game9g.score =parseInt(score);
  358. game9g.scoreName = "猜中"+score+"种水果";
  359. game9g.shareData.title = stitle+"";
  360. }
  361. </script>
  362. <div style="display: none;">
  363. <script type="text/javascript">
  364. game9g.utils.tongji();
  365. </script>
  366. </div>
  367. </body>
  368. </html>