вопрос ширины jcarousel - PullRequest
       14

вопрос ширины jcarousel

1 голос
/ 21 марта 2012

Я использую jCarousel на веб-сайте, который создаю для своей компании. Я использую JavaScript по умолчанию, который поставляется с jCarousel.

<ul id="mycarousel" class="jcarousel-list jcarousel-list-horizontal" style="overflow: hidden; position: relative; top: 0px; margin: 0px; padding: 0px; left: 0px;width: 2084px;">

Ширина генерируется javascript, который поставляется с jCarousel, но я могу зашифровать его, чтобы выяснить, где изменить значение.

Любая помощь будет отличной.

Вот ссылка на то, над чем я работаю: http://marcbrigham.com/lynxems/index.html

Ответы [ 3 ]

2 голосов
/ 21 марта 2012
.jcarousel-skin-tango .jcarousel-clip-horizontal {
    width:  245px;
    height: 75px;
}

Взят из стандартного скина Tango, который используется в примерах .

Какой скин / тему / CSS вы используете? jCarousel необходимо изменить width, чтобы включить слайд, но элемент обертки должен использовать overflow: hidden;.

UPDATE

Это редактирование CSS делает все в порядке, но если вам нужно, чтобы оно охватывало всю ширину #mainhome, вам следует рассмотреть возможность изменения размера изображений.

.jcarousel-skin-tango .jcarousel-container-horizontal {
  width: 765px;
  padding: 20px 40px;
  height: 200px;
}

.jcarousel-skin-tango .jcarousel-clip-horizontal {
  width: 775px;
  height: 190px;
}

Другим вариантом может быть добавление margin: 0 40px; к .jcarousel-skin-tango .jcarousel-clip-horizontal.

1 голос
/ 20 июня 2013

Вы также можете создать стиль CSS и добавить к нему !important, который переопределит встроенные стили.Например:

#carousel {
    width: 1000px !important;
}

Пока это работает, я обнаружил, что если контейнер слишком широкий, вы сможете прокручивать только элементы внутри него.Я все еще ищу обходной путь для этого.

Также есть новая версия (0.3.0), но пока нет хороших примеров на сайте разработчиков.

0 голосов
/ 21 марта 2012

просто добавьте стиль к вашему CSS:

.jcarousel-list-horizontal {width: x}

Al

...