暫無描述
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 8.2KB

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