Вывод кнопок prev и next за пределы слайдера по бокам

Тема в разделе "JavaScript", создана пользователем студент, 4 дек 2014.

Модераторы: ZiX
  1. студент

    студент

    Регистр.:
    3 фев 2009
    Сообщения:
    157
    Симпатии:
    1
    Вопрос в названии. Использую jMyCarousel от enova-tech.net.
    сайт где установлен слайдер: _http://new.simsar.az

    Нашел ответ тут, но у меня не получилось. Прошу помощи.
     
  2. vytyacom

    vytyacom Постоялец

    Регистр.:
    19 ноя 2014
    Сообщения:
    136
    Симпатии:
    55
    А чего не получается то?
    по ссылке с решением всё вполне логично

    2 тега надо в хтмл в нужных местах создать
    <a id="prev_btn"> </a>
    <a id="next_btn"> </a>

    Строка инициализации на сайте

    $(function() {
    $(".jMyCarousel").jMyCarousel({
    visible: '100%',
    eltByElt: true
    });
    });

    взять нужно из решения, получится

    $(".jMyCarousel").jMyCarousel({
    visible: '100%',
    eltByElt: true,
    btnPrev: $('#prev_btn'),
    btnNext: $('#next_btn')
    });
     
  3. zaxap83

    zaxap83 Постоялец

    Регистр.:
    6 дек 2010
    Сообщения:
    87
    Симпатии:
    28
    Если не получается сделать так, как написал vytyacom, можно сделать используя только css:
    1. В стеле screen.css (строка 964) в правиле .slider убрать строчку overflow: hidden;
    2. Там же (строка 1038) в правиле .slider .wrap-slider убрать position: relative;
    3. Там же (строки 1024 и 1027) в .slider .back и .slider .next менять left и right на нужное (для left отрицательное значение, например "-25px").
    Этими действиями вы отмените overflow: hidden для кнопок, но для самого слайдера это правило останется.
     
  4. студент

    студент

    Регистр.:
    3 фев 2009
    Сообщения:
    157
    Симпатии:
    1
    не получается то, что стрелки не выводятся. Их не видно.
     
  5. студент

    студент

    Регистр.:
    3 фев 2009
    Сообщения:
    157
    Симпатии:
    1
    Это стили другого слайдера (который над обсуждаемым слайдером.)
    Вот ссылка на нужный файл стилей.
     
  6. zaxap83

    zaxap83 Постоялец

    Регистр.:
    6 дек 2010
    Сообщения:
    87
    Симпатии:
    28
    div.jMyCarousel (строка 39) добавить position: initial !important;
    #SliderVideo (строка 9) добавить position: relative;
    к div.jMyCarousel .prev и div.jMyCarousel .next (строки 11 и 18) либо добавить left/right с !important, либо регулировать через margin
     
    студент нравится это.
  7. студент

    студент

    Регистр.:
    3 фев 2009
    Сообщения:
    157
    Симпатии:
    1
    этого не пришлось делать, все стоит как надо. Спасибо Вам за помощь, все отлично.
    А возможно ли сделать так, чтобы слайдер сам прокручивал слайды? Добавить куда-нибудь Avto... ?
     
  8. vytyacom

    vytyacom Постоялец

    Регистр.:
    19 ноя 2014
    Сообщения:
    136
    Симпатии:
    55
    похоже слайдер уже разработчиком не поддерживается. документации нет. нашел копипаст видимо тут.

    там есть
    auto
    whether the carousel start scrolling automatically (manual mode deactivated, no arrows). true or false.


    т.е. где скрипт инициализации надо добавить

    $(function() {
    $(".jMyCarousel").jMyCarousel({
    visible: '100%',
    eltByElt: true,
    auto: true
    });
    });

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

    студент

    Регистр.:
    3 фев 2009
    Сообщения:
    157
    Симпатии:
    1
    спасибо за помощь, сделал как Вы сказали и все заработало и было хорошо, пока я не открыл сайт в опере и хроме (обычно использую только мозиллу). В обоих браузерах нижняя часть слайдера не видна. Не помогает и обновление страницы. Исправляется если в меню кликнуть на кнопку Главная.
    Вот как слайдер выглядит вначале
    [​IMG]
    а так после нажатия на кнопку меню Главная
    [​IMG]
    в чем может быть проблема, помогите пожалуйста разобраться. 2 дня мучаюсь с этим, не могу исправить.
     
  10. zaxap83

    zaxap83 Постоялец

    Регистр.:
    6 дек 2010
    Сообщения:
    87
    Симпатии:
    28
    Скорее всего проблема в том, что скрипт рассчитывает высоту блока раньше, чем в дочерние подгружается контент. Задайте для div.jMyCarousel ul li (строка 45) min-height: 115px, должно помочь.
     
    студент нравится это.