Как в слайдере настроить ширину и высоту?

голоса: 0

Здравствуйте, подскажите пожалуйста, где тут настройка ширины и высоты в данном слайдере?
Особенно необходимо узнать, где настраивается ширина.


<link rel='stylesheet' href='https://anitub.ru/script/style/flexslider.css' type='text/css' media='all' />
<link rel='stylesheet' href='https://anitub.ru/script/style/public.css' type='text/css' media='all' />
<script type='text/javascript' src='https://anitub.ru/script/js/jquery.flexslider.js'></script>
<style>
 #metaslider.flexslider li {margin-right: 5px !important;}
 #ds-flexslider {max-width:255px; margin:0 auto;}</style>
<div id="ds-flexslider" class="metaslider metaslider-flex">
 <div id="metaslider_container"><div id="metaslider" class="flexslider">

<ul class="slides"><li style="display: none;"><a href="/news/2018-04-20-26" target="_blank">
 <img src="https://anitub.ru/img/Decor/cap/PROMO/1.jpg" style="width: 255px; height: 358px;" alt="Мастера Меча Онлайн: Алисизация - (3 сезон)" /></a>
 <div class="caption-wrap"><div class="caption">Мастера Меча Онлайн: Алисизация - (3 сезон)</div></div></li>

 <li style="display: none;"><a href="/news/2018-10-18-73" target="_blank">
 <img src="https://anitub.ru/img/Decor/cap/PROMO/2.jpg" style="width: 255px; height: 358px;" alt="Этот глупый свин не понимает мечту девочки-зайки" /></a>
 <div class="caption-wrap"><div class="caption"Этот глупый свин не понимает мечту девочки-зайки</div></div></li>
 
 <li style="display: none;"><a href="/news/2018-10-16-72" target="_blank">
 <img src="https://anitub.ru/img/Decor/cap/PROMO/3.jpg" style="width: 255px; height: 358px;" alt="Убийца Гоблинов / Goblin Slayer - (1 сезон)" /></a>
 <div class="caption-wrap"><div class="caption">Убийца Гоблинов / Goblin Slayer - (1 сезон)</div></div></li>

 <li style="display: none;"><a href="/news/2018-07-10-55" target="_blank">
 <img src="https://anitub.ru/img/Decor/cap/PROMO/4.jpg" style="width: 255px; height: 358px;" alt="Токийский Гуль: Перерождение / Tokyo Ghoul:Re - (3 сезон)" /></a>
 <div class="caption-wrap"><div class="caption">Токийский Гуль: Перерождение / Tokyo Ghoul:Re - (3 сезон)</div></div></li>

<li style="display: none;"><a href="/news/2018-10-24-74" target="_blank">
 <img src="https://anitub.ru/img/Decor/cap/PROMO/6.jpg" style="width: 255px; height: 358px;" alt="Индекс волшебства 3 / Toaru Majutsu no Index III - (3 сезон)" /></a>
 <div class="caption-wrap"><div class="caption">Индекс волшебства 3 / Toaru Majutsu no Index III - (3 сезон)</div></div></li>
 </ul></div></div></div>
<script>
 $(document).ready(function () {
 $('#metaslider').flexslider({
 slideshowSpeed:3000,
 animation:'slide',
 controlNav:true,
 directionNav:true,
 pauseOnHover:true,
 direction:'horizontal',
 reverse:false,
 animationSpeed:600,
 easing:"linear",
 slideshow:true,
 itemWidth:600,
 itemMargin:5,
 useCSS:true });
});
</script>

Адрес сайта https://anitub.ru/
| Автор: | Категория: Дизайн сайта
Изменение категории | | Автор: Yuri_Geruk

Ответов: 1

голоса: 0

Чтобы отрегулировать ширину, достаточно в стили прописать:

.slider1 {width: 500px!important;}

где 500 это ширина, и чтобы отрегулировать высоту, в стилях ищем строку:

.slide .photo{height: 200px!important;-webkit-filter:brightness(.5);filter:brightness(.5);}

добавить выделенное красным и вместо 200 прописать нужную высоту.

| Автор:
Я прописывал .slider1 {width: 500px!important;} в конце стиля, и в начале стиля но всё бесполезно, ширина не изменяется...
ANITUB,

Извините, перепутал ваши слайдеры. Если вы об слайдере в правом контейнере этом маленьком, то вот так:

#metaslider,.slides,.flex-viewport {width:200px;height:200px!important;}

соответственно ширину и высоту настраивайте под себя вместо значений 200

...