Добрый вечер! подскажите пожалуйста в чем разница между подключением ссылок stackpath и maxcdn, как я поняла у всех разный результат и разные классы и как тогда понять что к чему относится?
Буду очень благодарна!
Судя по названиям это разные провайдеры CDN. Не должно быть разнцы в наборе классов (если речь о CSS). Разница может быть только в скорости и доступности этих CDN в разных точках планеты. Те кто плотнее работает с этим вопросом может лучше рассказать о разнице в провайдерах. Желательно использовать одну и ту же CDN.
Я бы выбирал maxcdn только потому именно ее встречал чаще всего в исходниках.
1 лайк
спасибо Дмитрий, но тем не менее я пыталась сравнивать и брала разные примеры и меняла ссылки и ни у кого не сработало с другим подключением и я пару дней мучилась пока это поняла, тк уже решила что пример устаревший, но увы
как по мне то разницы не должно быть иначе это аврал какой-то
и я немного погуглила и тоже поняла что дело только в локализации
Я понял мысль только частично. Главный вопрос - остались ли непонятки?
думаю остались) но буду следовать твоему совету, собственно я ему уже и следовала
но если ты глянешь на этот код из w3shool и попробуешь проиграть его с другими подключениями и объяснить в чем моя ошибка
<!DOCTYPE html>
<html lang="en">
<head>
<title>Carousel W3</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
<!-- <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
-->
</head>
<body>
<div class="container">
<h2>Carousel Example</h2>
<div id="myCarousel" class="carousel slide">
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
</ol>
<!-- Wrapper for slides -->
<div class="carousel-inner">
<div class="item active">
<img class="img-responsive center-block" src="img/mountains.jpg" alt="Los Angeles" style="width:50%;">
</div>
<div class="item">
<img class="img-responsive center-block" src="img/nature.jpg" alt="Chicago" style="width:50%;">
</div>
<div class="item">
<img class="img-responsive center-block" src="img/waterfall.jpg" alt="New york" style="width:50%;">
</div>
</div>
<!-- Left and right controls -->
<a class="left carousel-control" href="#myCarousel" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span>
<!-- <span class="sr-only">Previous</span> -->
</a>
<a class="right carousel-control" href="#myCarousel" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span>
<!-- <span class="sr-only">Next</span> -->
</a>
</div>
</div>
</body>
</html>
следующий пример также не работает если поменять подключения
а также если в блоках div class=“carousel-item” убрать класс carousel, что привычно для maxcdn
<!DOCTYPE html>
<html lang="en">
<head>
<title>Carousel ID</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
<!-- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
-->
</head>
<body>
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
</ol>
<!-- Wrapper for slides -->
<div class="carousel-inner">
<div class="carousel-item active">
<!-- display-block и width-100 -->
<img class="d-block w-100 vh-100" src="img/mountains.jpg">
</div>
<div class="carousel-item">
<img class="d-block w-100 vh-100" src="img/nature.jpg">
</div>
<div class="carousel-item">
<img class="d-block w-100 vh-100" src="img/waterfall.jpg">
</div>
</div>
<a href="#myCarousel" class="carousel-control-prev" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a href="#myCarousel" class="carousel-control-next" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</body>
</html>
еще не пойму почему не работает плавный просмотр слайдов
Это разные версии библиотек. Поэтому разные классы у подключаемых файлов. Цифры в урле имеют значение, тут подробнее написано какое Семантическое Версионирование 2.0.0 | Semantic Versioning
А это разные варианты библиотеки (слим и обычный) подробнее о разнице можно читать тут: What are the differences between normal and slim package of jquery? - Stack Overflow. Очень возможно что плагины не работают из-за отсутствующих функций в jquery-slim.
1 лайк
да, это был встречный вопрос - выходит от разных версий jquery - min, slim, light зависит результат? а как на счет bootstrap версий? с ними тоже самое?
Обычно разные мажорные версии (первое число из трех в последовательности x.x.x) имеют несовместимый набор api. Это значит что код, посмотренный на api версии 2 скорее всего несовместим с кодом, построенным на api версии 3.
Редко, но возможно что решения будут работать для разных версий api. Но это исключение и на него не нужно опираться
я не поняла, те упрощенными версиями лучше не пользоваться?
Версии библиотеки типа 3.4.1 и варианты типа slim и full - это разные вещи. Я говорил о версиях. Почитай https://semver.org/lang/ru/ там тоже про версии, но другими более выверенными словами.
1 лайк
а я про варианты)
“Упрощенными”, “урезанными” версиями можно пользоваться только если понимаешь что делаешь. Обычно они не являются заменой полным версиям и несут с собой последствия которые нужно просчитать и принять/отвергнуть.
1 лайк
я понимаю что они не замена, но правильно ли я поняла, что они не на все случаи подходят, поскольку они обрезанные
Да, верно
спасибо Дима