goto.js 7.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306
  1. // sec03排名table輪播
  2. $('#sec03-slider').slick({
  3. arrows: false,
  4. slidesToShow: 1,
  5. slidesToScroll: 1,
  6. infinite: true,
  7. });
  8. $('#sec03-slider-next').click(function () {
  9. $('#sec03-slider').slick('slickNext')
  10. });
  11. // sec05 熱門作品 手機輪播
  12. $('#sec05-moblie-slider').slick({
  13. arrows: false,
  14. slidesToShow: 1,
  15. slidesToScroll: 1,
  16. infinite: true,
  17. });
  18. $('#sec05-slider-next').click(function () {
  19. $('#sec05-moblie-slider').slick('slickNext')
  20. });
  21. // sec05桌機輪播
  22. $('#sec05-destop-slider').slick({
  23. arrows: true,
  24. slidesToShow: 3,
  25. slidesToScroll: 3,
  26. infinite: true,
  27. });
  28. // sec06桌機輪波
  29. // $('#sec06-container').slick({
  30. // arrows: true,
  31. // slidesToShow: 4,
  32. // slidesToScroll: 3,
  33. // infinite:true,
  34. // });
  35. $(function () {
  36. $('#sec06-container').slick({
  37. arrows: false,
  38. slidesToShow: 4,
  39. slidesToScroll: 3,
  40. infinite: true,
  41. responsive: [
  42. {
  43. breakpoint: 600, // RWD在1024寬度時切換顯示數量
  44. settings: {
  45. arrows: false,
  46. slidesToShow: 1, //一次顯示3個
  47. slidesToScroll: 1,//切換下一頁時移動3個
  48. }
  49. }, {
  50. breakpoint: 600,// RWD在600寬度時切換顯示數量
  51. settings: {
  52. arrows: false,
  53. slidesToShow: 1,//一次顯示2個
  54. slidesToScroll: 1,//切換下一頁時移動2個
  55. }
  56. },
  57. ]
  58. });
  59. })
  60. // sec04 洞察報告 手機輪播
  61. $('#sec04-moblie-container').slick({
  62. arrows: false,
  63. slidesToShow: 1,
  64. slidesToScroll: 1,
  65. infinite: false,
  66. // centerMode: true,
  67. });
  68. $('#sec04-slider-next').click(function () {
  69. $('#sec04-moblie-container').slick('slickNext')
  70. });
  71. // 手機板menu彈跳視窗
  72. $("#menu-box2").hide();
  73. $("#menu-box").hide();
  74. $(".link").click(function () {
  75. $("#menu-box").fadeOut("slow", function () {
  76. $("#menu-box2").fadeOut("slow");
  77. // Animation complete.
  78. });
  79. });
  80. $("#menu-btn1").click(function () {
  81. $("#menu-box").fadeIn();
  82. $("#menu-box2").fadeIn();
  83. });
  84. $(".close").click(function () {
  85. $("#menu-box").fadeOut();
  86. $("#menu-box2").fadeOut();
  87. });
  88. $("*").each(function (index, element) {
  89. // 此元素被點選後執行
  90. $(this).click(function (e) {
  91. // 取得被點選元素的屬性:data-gt-target
  92. var target = $(this).attr("data-gt-target");
  93. var duration = $(this).attr("data-gt-duration");
  94. var offset = $(this).attr("data-gt-offset");
  95. // JS 語法:判斷式
  96. // if (條件) {程式區塊}
  97. // 當條件成立,會執行程式區塊
  98. // 如果 目標有資料 才會執行 { } 內的程式
  99. // 避免出現 undefine (未定義 - 不存在的資料)
  100. if (target) {
  101. //console.log("目標:" + target);
  102. //console.log("時間:" + duration);
  103. //console.log("位移:" + offset);
  104. // 上方位置 = 目標區塊.位移().上方位置
  105. var top = $(target).offset().top;
  106. //console.log("要前往元素的上方位置:" + top);
  107. // 網頁元素.停止().動畫({ 上方捲動:指定元素 - 位移},持續時間)
  108. // parseInt() 將文字轉為數字
  109. $("html").stop().animate({
  110. scrollTop: top - offset
  111. }, parseInt(duration));
  112. }
  113. });
  114. });
  115. // 避免動畫與使用者滾輪衝突
  116. // html 在滾動滾輪時 停止 html 所有效果
  117. $("html").on("mousewheel", function () {
  118. $("html").stop();
  119. });
  120. $(".sec03-table-title").addClass("contant-toggle");
  121. $("#sec03-slider").on('beforeChange', function (event, slick, currentSlide, nextSlide) {
  122. console.log('beforeChangeEvent: currenSlide=' + currentSlide + ', nextSlide= ' + nextSlide);
  123. if (nextSlide == 1) {
  124. $(".sec03-table-title").removeClass("contant-toggle");
  125. $(".sec03-table-title2").addClass("contant-toggle");
  126. }
  127. else if (nextSlide == 0) {
  128. $(".sec03-table-title2").removeClass("contant-toggle");
  129. $(".sec03-table-title").addClass("contant-toggle");
  130. }
  131. });
  132. // 電腦版email
  133. $.fn.serializeObject = function () {
  134. var o = {};
  135. var a = this.serializeArray();
  136. // o["id"] = 0;
  137. // o["time_stamp"] = "";
  138. $.each(a, function () {
  139. if (o[this.name]) {
  140. if (!o[this.name].push) {
  141. o[this.name] = [o[this.name]];
  142. }
  143. o[this.name].push(this.value || '');
  144. } else {
  145. o[this.name] = this.value || '';
  146. }
  147. });
  148. return o;
  149. };
  150. $(".contact-form-destop").submit(function (e) {
  151. /* var formRef = $('#form1').serializeArray();
  152. var jsonString = JSON.stringify(formRef);*/
  153. var jsonInfo = $('.contact-form-destop').serializeObject();
  154. var jsonString = JSON.stringify(jsonInfo);
  155. console.log(jsonString),
  156. $.ajax({
  157. type: 'POST',
  158. url: 'https://nftboard.info:8001/add_sub',
  159. data: jsonString,
  160. dataType: 'json',
  161. success: function (data) {
  162. console.log('送出成功: ' + data);
  163. alert("訂閱成功");
  164. // if (data == 0) {
  165. // alert("送出成功");
  166. // } else if (data == 1) {
  167. // alert("此email已填過表單");
  168. // } else if (data == 2) {
  169. // alert("此phone已填過表單");
  170. // } else if (data == 3) {
  171. // alert("此email、phone已填過表單");
  172. // }
  173. // location.reload();
  174. },
  175. beforeSend: function () {
  176. console.log('beforeSend');
  177. },
  178. complete: function () {
  179. console.log('complete');
  180. },
  181. error: function (jqXHR, textStatus, errorThrown) {
  182. console.log(JSON.stringify(jqXHR));
  183. console.log("AJAX errr: " + textStatus + ' : ' + errorThrown);
  184. console.log('送出失敗: ' + jqXHR.responseText);
  185. }
  186. });
  187. return false;
  188. });
  189. // 手機板 email
  190. $.fn.serializeObject = function () {
  191. var o = {};
  192. var a = this.serializeArray();
  193. $.each(a, function () {
  194. if (o[this.name]) {
  195. if (!o[this.name].push) {
  196. o[this.name] = [o[this.name]];
  197. }
  198. o[this.name].push(this.value || '');
  199. } else {
  200. o[this.name] = this.value || '';
  201. }
  202. });
  203. return o;
  204. };
  205. $(".contact-form-mobile").submit(function (e) {
  206. /* var formRef = $('#form1').serializeArray();
  207. var jsonString = JSON.stringify(formRef);*/
  208. var jsonInfo = $('.contact-form-mobile').serializeObject();
  209. var jsonString = JSON.stringify(jsonInfo);
  210. console.log(jsonString),
  211. $.ajax({
  212. type: 'POST',
  213. url: 'https://nftboard.info:8001/add_sub',
  214. data: jsonString,
  215. dataType: 'json',
  216. success: function (data) {
  217. console.log('送出成功: ' + data);
  218. alert("訂閱成功");
  219. // if (data == 0) {
  220. // alert("送出成功");
  221. // } else if (data == 1) {
  222. // alert("此email已填過表單");
  223. // } else if (data == 2) {
  224. // alert("此phone已填過表單");
  225. // } else if (data == 3) {
  226. // alert("此email、phone已填過表單");
  227. // }
  228. location.reload();
  229. },
  230. beforeSend: function () {
  231. console.log('beforeSend');
  232. },
  233. complete: function () {
  234. console.log('complete');
  235. },
  236. error: function (jqXHR, textStatus, errorThrown) {
  237. console.log(JSON.stringify(jqXHR));
  238. console.log("AJAX errr: " + textStatus + ' : ' + errorThrown);
  239. console.log('送出失敗: ' + jqXHR.responseText);
  240. }
  241. });
  242. return false;
  243. });
  244. $(function() {
  245. $("#sec05-moblie").swipe( { fingers:'all', swipeLeft:swipe1, swipeRight:swipe2} );
  246. function swipe1(event, direction, distance, duration, fingerCount) {
  247. $('#sec05-moblie-slider').slick('slickNext')//向左滑動你要執行的動作
  248. }
  249. function swipe2(event, direction, distance, duration, fingerCount) {
  250. $('#sec05-moblie-slider').slick('slickPrev') //向右滑動你要執行的動作
  251. }
  252. });
  253. $(function() {
  254. $(".sec05-button").swipe( { fingers:'all', swipeLeft:swipe1, swipeRight:swipe2} );
  255. function swipe1(event, direction, distance, duration, fingerCount) {
  256. $('#sec05-moblie-slider').slick('slickNext')//向左滑動你要執行的動作
  257. }
  258. function swipe2(event, direction, distance, duration, fingerCount) {
  259. $('#sec05-moblie-slider').slick('slickPrev') //向右滑動你要執行的動作
  260. }
  261. });