Ця стаття є дзеркальною статтею машинного перекладу, будь ласка, натисніть тут, щоб перейти до оригінальної статті.

Architect_Programmer_Code Сільськогосподарська мережа»Архітектор › Фронтенд-дизайн і веб › Html/CSS/JavaScript › JS адаптується до графа каруселі розміру екрану
Вид: 8656|Відповідь: 0

[JavaScript] JS адаптується до графа каруселі розміру екрану

[Копіювати посилання]
Опубліковано 25.09.2020 10:15:17 | | | |
Вимоги: Під час доступу до мобільного терміналу карусель показує лише один елемент контенту, на планшетному терміналі — 2 елементи, а на стороні ПК — 4 елементи.

По-перше, під зображеннями:



Ми знаємо, що Bootstrap має сіткову систему, яка може дуже добре адаптуватися залежно від розміру пристрою, принципом є медіа в CSS, але моя карусельна функція використовує плагін Swiper, який налаштований відповідно до параметрів js.

Swiper — це плагін для ефекту свайпу, створений чисто на JavaScript для мобільних пристроїв, таких як мобільні телефони та планшети.
Система завантаження сітки:



Деталі:Вхід за гіперпосиланням видно.

Якщо ви використовуєте чистий CSS, код такий (для мене ні):

js оцінюється методом Window matchMedia(), параметри коригуються та адаптуються. Код виглядає так:

(Кінець)




Попередній:Потоки .NET/C# фіксують інформацію про винятки
Наступний:[Реальний бій] ASP.NET Core базується на розподіленому розпродажі замків Redis
Застереження:
Усе програмне забезпечення, програмні матеріали або статті, опубліковані Code Farmer Network, призначені лише для навчання та досліджень; Вищезазначений контент не повинен використовуватися в комерційних чи незаконних цілях, інакше користувачі несуть усі наслідки. Інформація на цьому сайті надходить з Інтернету, і спори щодо авторських прав не мають до цього сайту. Ви повинні повністю видалити вищезазначений контент зі свого комп'ютера протягом 24 годин після завантаження. Якщо вам подобається програма, будь ласка, підтримуйте справжнє програмне забезпечення, купуйте реєстрацію та отримайте кращі справжні послуги. Якщо є будь-яке порушення, будь ласка, зв'яжіться з нами електронною поштою.
Mail To:help@itsvse.com