暫無描述
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

ramproducts.html 9.6KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8" />
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  6. <meta http-equiv="X-UA-Compatible" content="ie=edge" />
  7. <link rel="shortcut icon" type="image/x-icon" href="./dist/assets/imgs/favicon.gif">
  8. <link rel="stylesheet" href="./libs/bootstrap/css/bootstrap.min.css" />
  9. <link rel="stylesheet" href="./dist/css/main.css" />
  10. <link rel="stylesheet" href="./styles/style.css">
  11. <link rel="stylesheet" href="./libs/owlcarousel/Css/owl.carousel.min.css">
  12. <link rel="stylesheet" href="./libs/owlcarousel/Css/owl.theme.default.min.css">
  13. <link rel="stylesheet" href="./style.css">
  14. <link rel="stylesheet" href="./dist/css/vendor/bootstrap.min.css">
  15. <link rel="stylesheet" href="./dist/css/vendor/bootstrap.min.css">
  16. <link rel="stylesheet" href="./dist/css/vendor/vandella.css">
  17. <link rel="stylesheet" href="./dist/css/vendor/jellybelly.css">
  18. <!-- <link rel="stylesheet" href="./dist/css/vendor/icofont.min.css"> -->
  19. <link rel="stylesheet" href="./dist/css/vendor/fontello.css">
  20. <link rel="stylesheet" href="./dist/css/plugins/easyzoom.css">
  21. <link rel="stylesheet" href="./dist/css/plugins/slick.css">
  22. <link rel="stylesheet" href="./dist/css/plugins/nice-select.css">
  23. <link rel="stylesheet" href="./dist/css/plugins/animate.css">
  24. <link rel="stylesheet" href="./dist/css/plugins/magnific-popup.css">
  25. <link rel="stylesheet" href="./dist/css/plugins/jquery-ui.css">
  26. <link rel="stylesheet" href="./dist/css/style.css">
  27. <link rel="stylesheet" href="./dist/css/fontawesome.all.min.css">
  28. <link rel="stylesheet" href="./dist/css/fontawesome.min.css">
  29. <title>Ram | Anwi</title>
  30. <style>
  31. .product_details{
  32. right: 300px;
  33. top: 40%;
  34. }
  35. /* .card:hover{
  36. box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;
  37. }
  38. .card:hover img{
  39. transform: scale(1.1);
  40. } */
  41. /* .card:hover .btn{
  42. background-color: #000 !important;
  43. color:#ffff !important;
  44. }
  45. .card-title{
  46. font-size: 1.2rem;
  47. } */
  48. </style>
  49. </head>
  50. <body class="product_pg">
  51. <auth-loader></auth-loader>
  52. <!-- navbar -->
  53. <div id="navbar-head" class="shadow"></div>
  54. <!-- end-navbar -->
  55. <!-- main-body -->
  56. <main class="main-body home-main-container loading-main pt-md-0 pt-5 d-none">
  57. <!-- <section class="services h-100 pt-3 bg-gradient-anwi">
  58. <div class="container pt-5 ">
  59. <div class="text-center text-white ">
  60. </div>
  61. </div>
  62. </section> -->
  63. <section class="position-relative bg-black section-one d-none">
  64. <!-- <img src="./dist/assets/imgs/allin_imgs/ssd_img.png" class="img-fluid w-100" alt="ssd_img"/> -->
  65. <iframe
  66. src="https://player.vimeo.com/video/821425902?h=d2d8572f26&amp&autoplay=1&loop=1&autopause=0&badge=0&player_id=0&controls=0&muted=1"
  67. width="1536px" height="860px" frameborder="0" allow="autoplay; fullscreen; picture-in-picture"
  68. allowfullscreen></iframe>
  69. <!-- <iframe src="https://player.vimeo.com/video/816131155?h=4667fd18e1&autoplay=1&loop=1&autopause=0&badge=0&player_id=0&controls=0&muted=1" width="1536px" height="860px" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen></iframe> -->
  70. <!-- <div class="position-fixed text-white volume_btn" style="right:35px;bottom:20px">
  71. <p class="mb-0 d-none bg-blue p-2 px-3 rounded-circle shadow" id="mute"><i class="fa-solid fa-volume-low"></i></p>
  72. <p class="bg-blue mb-0 p-2 px-3 rounded-circle shadow" id="unmute"><i class="fa-sharp fa-volume-xmark"></i></p>
  73. </div> -->
  74. </section>
  75. <section class="py-5">
  76. <div class="container-fluid position-relative">
  77. <div class="text-center">
  78. <img src="./dist/assets/imgs/new_img/main_banner.webp" class="w-100"/>
  79. </div>
  80. <div class="position-absolute product_details">
  81. <div>
  82. <input type="hidden" name="" id="skudetailitem">
  83. <h2 class="productname font-weight-600">RAM'S</h2>
  84. </div>
  85. </div>
  86. </div>
  87. </section>
  88. <section class="pt-2 ramsContainer section-two" id="ora_products_">
  89. <div class="products-container container pb-5" id="pills-tabContent">
  90. <div class="text-center pb-md-5 pt-5">
  91. <h1 class="satoshi_font pb-md-4 pb-3">Discover the revolution of ORA</h1>
  92. <p class="fs-6 satoshi_font fw-500 pb-md-4">
  93. ORA Memory Series, harnessing cutting-edge<br>
  94. Graphene technology for blazing-fast heat absorption in NVMe SSDs.<br>
  95. Boasting an ultra-slim 1mm Heatsink, we defy temperature limits and redefine storage
  96. performance.
  97. </p>
  98. </div>
  99. <div class="text-center py-md-5 py-4">
  100. <span class="bg-black fs-5 px-md-4 py-md-2 py-2 px-4 rounded-3 text-white">Join the future with Anwi
  101. Systems</span>
  102. </div>
  103. <div class="row product_card_section">
  104. <!--desktop--->
  105. <div class="col-sm-4 p-3">
  106. <div class="product_card_3 shadow ram_card">
  107. <div class="card-item-header">
  108. <div class="card-header-sub-3"><a class=" py-md-1" href="">
  109. <img src="./dist/assets/imgs/Navbar/ora_ddr4_desktop.png"
  110. class="w-100 h-100"></a>
  111. </div>
  112. </div>
  113. <div class="card-item-body">
  114. <h3 cclass="mb-2"> <a href="#" class=""> ORA 8GB DDR4 3200MHz Desktop RAM </a></h3>
  115. <hr>
  116. <h6>8GB DDR4</h6>
  117. <h6>3200 Mhz</h6>
  118. <div class="py-2 card_product_footer">
  119. <a href="#" class="w-100 satoshi_font ram_btn"
  120. data_name="ORA 8GB DDR4 3200MHz Desktop RAM " data_version="DDR4"
  121. data_device="Desktop" data_gb="8GB" data_price="2900">Details </a>
  122. </div>
  123. </div>
  124. </div>
  125. </div>
  126. <!--desktop--->
  127. </div>
  128. </div>
  129. </section>
  130. </main>
  131. <div id="enquire"></div>
  132. <!-- footer -->
  133. <div id="footer-head"></div>
  134. <!-- end-footer -->
  135. <script src="./dist/js/components/authloader/authloader.js"></script>
  136. <script src="./libs/bootstrap/js/bootstrap.bundle.min.js"></script>
  137. <script src="./dist/js/jquery.min.js"></script>
  138. <script src="./libs/owlcarousel/js/owl.carousel.min.js"></script>
  139. <script src="./libs/axios.min.js"></script>
  140. <script src="./libs/cookies.min.js"></script>
  141. <script src="./dist/toaster/toastr.js"></script>
  142. <script src="./dist/js/fontawesome.all.js"></script>
  143. <script src="./dist/js/fontawesome.min.js"></script>
  144. <script src="./dist/js/vendor/modernizr-3.11.7.min.js"></script>
  145. <script src="./dist/js/vendor/jquery-v3.6.0.min.js"></script>
  146. <script src="./dist/js/vendor/jquery-migrate-v3.3.2.min.js"></script>
  147. <script src="./dist/js/vendor/bootstrap.min.js"></script>
  148. <script src="./dist/js/plugins/slick.js"></script>
  149. <script src="./dist/js/plugins/wow.js"></script>
  150. <script src="./dist/js/plugins/svg-injector.min.js"></script>
  151. <script src="./dist/js/plugins/jquery.nice-select.min.js"></script>
  152. <!-- Main JS -->
  153. <script src="./dist/js/utils/helpers.js"></script>
  154. <script src="./dist/js/navbar.js"></script>
  155. <script src="./dist/js/footer.js"></script>
  156. <script src="./dist/js/main.js"></script>
  157. <script src="./dist/js/auth/apiservice.js"></script>
  158. <script src="./dist/js/products/products.js"></script>
  159. <script>
  160. let ram_page = window.location.pathname;
  161. let loc = ram_page.includes('ramproducts.html');
  162. if (loc === true) {
  163. let imgs = `./dist/assets/imgs/anwi-logo-1.png`;
  164. $(".main-menu").find("nav ul li a").addClass("text-dark").removeClass("text-white");
  165. $(".logo-menu-wrap").find(".logo img").attr("src", imgs);
  166. $('.same-style').find('svg path').attr('fill', '#000');
  167. $('svg path').attr('fill', '#000');
  168. }
  169. function swapSections() {
  170. var sectionOne = document.querySelector('.section-one');
  171. var sectionTwo = document.querySelector('.section-two');
  172. var isMobile = window.matchMedia("(max-width: 768px)").matches;
  173. if (isMobile) {
  174. sectionOne.parentNode.insertBefore(sectionOne, sectionTwo);
  175. }
  176. }
  177. swapSections();
  178. // Call the swapSections function on load and resize
  179. // window.addEventListener('load', swapSections);
  180. window.addEventListener('resize', swapSections);
  181. setTimeout(function (){
  182. document.querySelector('auth-loader').hide();
  183. $('.home-main-container').removeClass('d-none');
  184. },1000);
  185. </script>
  186. </body>
  187. </html>