postavka.html 5.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120
  1. <!DOCTYPE html>
  2. <html lang="ru">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>автомобили</title>
  6. <link rel="stylesheet" type="text/css" href="./assets/styles/автомобили.css">
  7. <link rel="stylesheet" type="text/css" href="./assets/styles/авто2.css">
  8. <link rel="stylesheet" type="text/css" href="./assets/styles/table.css">
  9. <link rel="stylesheet" type="text/css" href="./assets/styles/background.css">
  10. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css">
  11. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.theme.default.min.css">
  12. <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  13. <script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"></script>
  14. <script src="https://cdn.jsdelivr.net/npm/papaparse@5.3.0/papaparse.min.js"></script>
  15. </head>
  16. <body>
  17. <div class="background">
  18. <img src="assets/imgs/fotka.jpg" alt="background" class="back_img">
  19. <img src="assets/imgs/fotka.jpg" alt="background" class="back_img">
  20. <div class="overlay"></div>
  21. </div>
  22. <div class="content">
  23. <div class="navbar">
  24. <a href="katalog.html">Автомобили</a>
  25. <a href="mainPage.html">На Главную</a>
  26. </div>
  27. <h1>Выберите свой автомобиль</h1>
  28. <div class="series">
  29. <div class="navbar">
  30. <a href="econom.html" id="ekonom">Эконом</a>
  31. <a href="komfort.html" id="comfort">Комфорт</a>
  32. <a href="bisnes.html" id="bizness">Бизнес</a>
  33. <a href="sportcar.html" id="sportcar">Спорткар</a>
  34. <a href="electrocar.html" id="electrocar" >Электромобили</a>
  35. <a href="bisnes.html" id="bizness" class="active">Поставка</a>
  36. </div>
  37. </div>
  38. <h1 class="in-stock">В наличии</h1>
  39. <div class="car-cards" id="car-cards-in-stock">
  40. <button id="readData">Получить данные</button>
  41. <div id="tableContainer"></div>
  42. <script>
  43. document.getElementById("readData").addEventListener("click", function() {
  44. fetch('https://raw.githubusercontent.com/nljubivaya/csv/master/postavka.csv')
  45. .then(response => response.text())
  46. .then(data => {
  47. Papa.parse(data, {
  48. encoding: 'UTF-8',
  49. complete: function(results) {
  50. const lines = results.data;
  51. const table = document.createElement("table");
  52. table.setAttribute("border", "1");
  53. table.setAttribute("width", "100%");
  54. const headerRow = table.insertRow();
  55. const headers = lines[0];
  56. headers.forEach(header => {
  57. const th = document.createElement("th");
  58. th.textContent = header;
  59. headerRow.appendChild(th);
  60. });
  61. for (let i = 1; i < lines.length; i++) {
  62. const data = lines[i];
  63. const row = table.insertRow();
  64. for (let j = 0; j < data.length; j++) {
  65. const td = document.createElement("td");
  66. td.textContent = data[j];
  67. row.appendChild(td);
  68. }
  69. }
  70. document.getElementById("tableContainer").appendChild(table);
  71. }
  72. });
  73. })
  74. .catch(error => {
  75. console.error('Ошибка при чтении данных:', error);
  76. });
  77. });
  78. </script>
  79. </div>
  80. <h1 class="in-stock">Под заказ</h1>
  81. <div class="carousel-container">
  82. <div class="owl-carousel">
  83. <div class="item">
  84. <img src="assets/katalog/biznes/b1.png" alt="1">
  85. </div>
  86. <div class="item">
  87. <img src="assets/katalog/biznes/b2.png" alt="2">
  88. </div>
  89. <div class="item">
  90. <img src="assets/katalog/biznes/b3.png" alt="3">
  91. </div>
  92. <div class="item">
  93. <img src="assets/katalog/biznes/b4.png" alt="4">
  94. </div>
  95. <div class="item">
  96. <img src="assets/katalog/biznes/b5.png" alt="5">
  97. </div>
  98. <div class="item">
  99. <img src="assets/katalog/biznes/b6.png" alt="6 ">
  100. </div>
  101. </div>
  102. <div class="series centered-button">
  103. <button id="scrollTopBtn" onclick="topFunction()" title="Вернуться в начало">Наверх</button>
  104. </div>
  105. </div>
  106. </div>
  107. <script src="assets/json/script.js"></script>
  108. <script src="assets/json/lentaAvto.js"></script>
  109. <script>
  110. // Функция для прокрутки наверх
  111. function topFunction() {
  112. document.body.scrollTop = 0; // Для Chrome, Safari и Opera
  113. document.documentElement.scrollTop = 0; // Для IE и Firefox
  114. }
  115. </script>
  116. </body>
  117. </html>