goto_202106081744.js 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171
  1. $(".banner-slider").slick({
  2. speed: 1000,
  3. swipe: true,
  4. arrows: false,
  5. });
  6. $(".content1-right").slick({
  7. dotsClass: 'slick-dots',
  8. dots: true,
  9. speed: 1000,
  10. arrows: false,
  11. });
  12. // banner輪播效果
  13. // $(".banner-slider").on('beforeChange', function (event, slick, currentSlide, nextSlide) {
  14. // console.log('beforeChangeEvent: currenSlide=' + currentSlide + ', nextSlide= ' + nextSlide);
  15. // if (nextSlide == 1) {
  16. // $("#animation2").addClass("animation-h1");
  17. // $("#btn-animation2").addClass("animation-btn");
  18. // $("#animation1").removeClass("animation-h1");
  19. // $("#btn-animation1").removeClass("animation-btn");
  20. // $("#animation3").removeClass("animation-h1");
  21. // $("#btn-animation3").removeClass("animation-btn");
  22. // }
  23. // else if (nextSlide == 2) {
  24. // $("#animation3").addClass("animation-h1");
  25. // $("#btn-animation3").addClass("animation-btn");
  26. // $("#animation1").removeClass("animation-h1");
  27. // $("#btn-animation1").removeClass("animation-btn");
  28. // $("#animation2").removeClass("animation-h1");
  29. // $("#btn-animation2").removeClass("animation-btn");
  30. // }else if (nextSlide == 0) {
  31. // $("#animation1").addClass("animation-h1");
  32. // $("#btn-animation1").addClass("animation-btn");
  33. // $("#animation2").removeClass("animation-h1");
  34. // $("#btn-animation2").removeClass("animation-btn");
  35. // $("#animation3").removeClass("animation-h1");
  36. // $("#btn-animation3").removeClass("animation-btn");
  37. // }
  38. // });
  39. // content輪播圖片偵測效果
  40. $(".text-1").addClass("contant-toggle");
  41. $(".content1-right").on('beforeChange', function (event, slick, currentSlide, nextSlide) {
  42. console.log('beforeChangeEvent: currenSlide=' + currentSlide + ', nextSlide= ' + nextSlide);
  43. if (nextSlide == 1) {
  44. $(".text-1").removeClass("contant-toggle");
  45. $(".text-2").addClass("contant-toggle");
  46. $(".text-3").removeClass("contant-toggle");
  47. } else if (nextSlide == 2) {
  48. $(".text-2").removeClass("contant-toggle");
  49. $(".text-1").removeClass("contant-toggle");
  50. $(".text-3").addClass("contant-toggle");
  51. } else if (nextSlide == 0) {
  52. $(".text-2").removeClass("contant-toggle");
  53. $(".text-1").addClass("contant-toggle");
  54. $(".text-3").removeClass("contant-toggle");
  55. }
  56. });
  57. $.fn.serializeObject = function () {
  58. var o = {};
  59. var a = this.serializeArray();
  60. o["id"] = 0;
  61. o["time_stamp"] = "";
  62. $.each(a, function () {
  63. if (o[this.name]) {
  64. if (!o[this.name].push) {
  65. o[this.name] = [o[this.name]];
  66. }
  67. o[this.name].push(this.value || '');
  68. } else {
  69. o[this.name] = this.value || '';
  70. }
  71. });
  72. return o;
  73. };
  74. $(".contact-form1").submit(function (e) {
  75. /* var formRef = $('#form1').serializeArray();
  76. var jsonString = JSON.stringify(formRef);*/
  77. var jsonInfo = $('.contact-form1').serializeObject();
  78. var jsonString = JSON.stringify(jsonInfo);
  79. console.log('Mike: ' + jsonString);
  80. $.ajax({
  81. type: 'POST',
  82. url: 'http://cal.ptt.cx/deco_request_detail',
  83. data: jsonString,
  84. dataType: 'json',
  85. success: function (data) {
  86. console.log('Mike:送出成功: ' + data);
  87. // if (data == 0) {
  88. // alert("送出成功");
  89. // } else if (data == 1) {
  90. // alert("email重複");
  91. // } else if (data == 2) {
  92. // alert("phone重複");
  93. // } else if (data == 3) {
  94. // alert("email、phone重複");
  95. // }
  96. },
  97. beforeSend: function () {
  98. console.log('Mike::beforeSend');
  99. },
  100. complete: function () {
  101. console.log('Mike:complete');
  102. },
  103. error: function (jqXHR, textStatus, errorThrown) {
  104. console.log(JSON.stringify(jqXHR));
  105. console.log("AJAX errr: " + textStatus + ' : ' + errorThrown);
  106. console.log('Mike:送出失敗: ' + jqXHR.responseText);
  107. }
  108. });
  109. return false;
  110. });
  111. $("*").each(function (index, element) {
  112. // 此元素被點選後執行
  113. $(this).click(function (e) {
  114. // 取得被點選元素的屬性:data-gt-target
  115. var target = $(this).attr("data-gt-target");
  116. var duration = $(this).attr("data-gt-duration");
  117. var offset = $(this).attr("data-gt-offset");
  118. // JS 語法:判斷式
  119. // if (條件) {程式區塊}
  120. // 當條件成立,會執行程式區塊
  121. // 如果 目標有資料 才會執行 { } 內的程式
  122. // 避免出現 undefine (未定義 - 不存在的資料)
  123. if (target) {
  124. //console.log("目標:" + target);
  125. //console.log("時間:" + duration);
  126. //console.log("位移:" + offset);
  127. // 上方位置 = 目標區塊.位移().上方位置
  128. var top = $(target).offset().top;
  129. //console.log("要前往元素的上方位置:" + top);
  130. // 網頁元素.停止().動畫({ 上方捲動:指定元素 - 位移},持續時間)
  131. // parseInt() 將文字轉為數字
  132. $("html").stop().animate({
  133. scrollTop: top - offset
  134. }, parseInt(duration));
  135. }
  136. });
  137. });
  138. // 避免動畫與使用者滾輪衝突
  139. // html 在滾動滾輪時 停止 html 所有效果
  140. $("html").on("mousewheel", function () {
  141. $("html").stop();
  142. });