product.html 4.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697
  1. <!DOCTYPE html>
  2. <html>
  3. <head lang="en">
  4. <include file="./Application/Home/View/Common/head_include.html" />
  5. <title>赛车模拟器价格_赛车游戏外设_厦门欣富地智能科技</title>
  6. </head>
  7. <body>
  8. <include file="./Application/Home/View/Common/head.html" />
  9. <div class="main_div">
  10. <div id="now_buy" style="cursor: pointer;position: absolute;"></div>
  11. <img src="https://img.x-motion.cn/home/image/product_1.jpg">
  12. <img src="https://img.x-motion.cn/home/image/product/product_11.jpg">
  13. <img src="https://img.x-motion.cn/home/image/product/product_14.jpg">
  14. <img src="https://img.x-motion.cn/home/image/product/product_12.jpg">
  15. <img src="https://img.x-motion.cn/home/image/product/product_15.jpg">
  16. <img src="https://img.x-motion.cn/home/image/product_6.jpg">
  17. <div class="product_banner clearfix">
  18. <div class="product_left">
  19. <img src="https://img.x-motion.cn/home/image/product/product_desc_3.jpg">
  20. </div>
  21. <div class="product_right">
  22. <div id="product_banner" class="carousel slide" data-ride="carousel">
  23. <div class="carousel-inner">
  24. <div class="carousel-item active">
  25. <div>
  26. <img class="d-block w-100" src="https://img.x-motion.cn/home/image/product_banner_1.jpg" alt="First slide" id="first-slide">
  27. </div>
  28. </div>
  29. <div class="carousel-item">
  30. <div>
  31. <img class="d-block w-100" src="https://img.x-motion.cn/home/image/product_banner_2.jpg" alt="First slide" id="second-slide">
  32. </div>
  33. </div>
  34. <div class="carousel-item">
  35. <div>
  36. <img class="d-block w-100" src="https://img.x-motion.cn/home/image/product_banner_3.jpg" alt="First slide" id="third-slide">
  37. </div>
  38. </div>
  39. <div class="carousel-item">
  40. <div>
  41. <img class="d-block w-100" src="https://img.x-motion.cn/home/image/product_banner_4.jpg" alt="First slide" id="fourth-slide">
  42. </div>
  43. </div>
  44. <div class="carousel-item">
  45. <div>
  46. <img class="d-block w-100" src="https://img.x-motion.cn/home/image/product_banner_5.jpg" alt="First slide" id="fifth-slide">
  47. </div>
  48. </div>
  49. <div class="carousel-item">
  50. <div>
  51. <img class="d-block w-100" src="https://img.x-motion.cn/home/image/product_banner_6.jpg" alt="First slide" id="sixth-slide">
  52. </div>
  53. </div>
  54. </div>
  55. <a class="carousel-control-prev" href="#product_banner" role="button" data-slide="prev">
  56. <span class="carousel-control-prev-icon" style="background-image:url(https://img.x-motion.cn/home/image/product_banner_left.png)" aria-hidden="true"></span>
  57. <span class="sr-only">Previous</span>
  58. </a>
  59. </div>
  60. </div>
  61. </div>
  62. </div>
  63. <include file="./Application/Home/View/Common/footer_logo.html" />
  64. <include file="./Application/Home/View/Common/footer.html" />
  65. </body>
  66. <script type="text/javascript">
  67. $(document).ready(function () {
  68. window.onresize = function () {
  69. set_position();
  70. };
  71. $('#now_buy').on('click', function(){
  72. $(".qiao-icon-user").get(0).click();
  73. });
  74. });
  75. function set_position() {
  76. var initial_width = 1920;
  77. var limit_width = 1240;
  78. var top = 260;
  79. var left = 890;
  80. var width = 130;
  81. var height = 55;
  82. var now_width = $(window).width();
  83. if(now_width<limit_width){
  84. now_width = limit_width;
  85. }
  86. var now_buy = $('#now_buy');
  87. $(now_buy).css('top', top * now_width / initial_width + 64);
  88. $(now_buy).css('left', left * now_width / initial_width);
  89. $(now_buy).css('width', width * now_width / initial_width);
  90. $(now_buy).css('height', height * now_width / initial_width);
  91. }
  92. window.onload = function () {
  93. set_position();
  94. };
  95. set_position();
  96. </script>
  97. </html>