#jquery #css #jquery-ui
#jquery #css #jquery-пользовательский интерфейс
Вопрос:
Я пытаюсь создать что-то вроде следующего JSFiddle, но у меня есть несколько проблем. Я пытаюсь создать свою версию в разделе, в котором она находится рядом с чем-то другим. На данный момент у меня есть это
<section class="no-padding" id="portfolio">
<div class="col-lg-6 col-sm-6" id="portfolio-left">
</div>
<div class="col-lg-6 col-sm-6" id="portfolio-right">
<div id="slider">
<ul>
<li style="background-color: #F00"></li>
<li style="background-color: #0F0"></li>
<li style="background-color: #00F"></li>
</ul>
</div>
</div>
</section>
Таким образом, часть слайдера находится только внутри portfolio-right
, которая занимает 50% экрана и 100vh
. Я настроил другой JSFiddle, который демонстрирует мою проблему. Таким образом, серая область, portfolio-left
которая мне нужна, остается нетронутой. Мне нужно, чтобы слайды с правой стороны были 100%
шириной. На данный момент для него установлено значение 400px
, и он отображается встроенным. Как только я устанавливаю его в 100%
, вторая и третья панели выпадают под первой, а не рядом с ней.
Кроме того, слайдер, похоже, у меня не работает. Есть ли какой-либо способ заставить это работать должным образом в моей настройке?
Большое спасибо
Комментарии:
1. Ваша скрипка загружает 2 разные версии jQuery. Что вы хотите использовать?
2. Обновленная скрипка: jsfiddle.net/Twisty/x4k5qk1w/2 Если каждый
li
пытается занимать 100% своего контейнера, тогда контейнеру нужна ширина. Если#slider
установлено значение 100%, то для него#portfolia-right
должна быть определена некоторая ширина. Вы не можете назначить 100% каждому элементу и ожидать, что они будут отображаться дальше вправо. Если вы хотите, чтобы он был динамическим, то#portfolio-left
должно быть какое-то значение, либо количество, либо процент. Например, 75% и 25%. Если право должно быть 100%, из чего оно состоит на 100%?3. Если я установлю значение 100%, оно снова упадет. Это основано на bootstrap, поэтому #portfolio-right составляет 50%. Это означает, что ползунок должен составлять 100% от этих 50%, но, похоже, он не работает, не заставляя li опускаться под ним
4. кажется, работает, если я установлю li равным 33,3%. Почему это? Спасибо