Slick Slider Поместите текст над каждым слайдом

У меня есть код ниже, используя Slick Slider, чтобы повернуть divs, который работает нормально, я хочу добавить текст над строкой cale-rosters div, который вращается вместе с div, и все три появятся.Slick Slider Поместите текст над каждым слайдом

Ex. Каждый div - это день, среда, четверг, пятница. текст «среда, четверг, пятница» всегда должен отображаться над нижним div «рядовой cale-rosters» ниже «cale-date» div. Но когда вы нажимаете на среду, только первый div показывает, когда нажимается четверг, только второй DIV шоу, и когда пятница щелкает только третий DIV шоу.

<div class="row cale-mid"> 
    <div class="col-sm-12 cale-cont text-center"> 
     <h2>CALENDAR OF EVENTS</h2> 
     <p class="cale-location">Golf Course</p> 
     <br/> 
     <p class="cale-date">4 AUG, 2016</p> 
    </div> 
    <div class="weekday"> 
    Wednesday 
    </div> 
    <div class="weekday"> 
    Thursday 
    </div> 
    <div class="weekday"> 
    Friday 
    </div> 
</div> 
<div class="row cale-rosters"> 
    <div class="col-sm-12 cale-rosters-cont"> 
     <div class="calendar-cont text-left"> 
     <div class="calendar"> 
      <div> 
       <span class="time-one">7:30 - 8:30 AM</span> <span class="event">BREAKFAST</span><br/> 
       <span class="location">LODGE</span><br/><br/> 

      </div> 
      <div> 
       <span class="time-one">7:30 - 8:30 AM</span> <span class="event">BREAKFAST</span><br/> 
       <span class="location">LODGE</span><br/><br/> 
      </div> 
      <div> 
       <span class="time-one">7:30 - 8:30 AM</span> <span class="event">BREAKFAST</span><br/> 
       <span class="location">LODGE</span><br/><br/> 
      </div> 
     </div> 
     </div> 
    </div> 
</div>

источник

2016-06-10 Ryeboflaven

вы можете добавить пример на JSfiddle, он мог быть полезным, чтобы помочь вам, tnx –

Я не могу заставить все работать в jsfiddle с публикацией javascript. Если вы знакомы с ползунком, я использую http://kenwheeler.github.io/slick/, тогда есть примеры. – Ryeboflaven

здесь есть [пример] (https://jsfiddle.net/giuseppe_straziota/st3ce2m8/), который я написал, помогите мне понять, чего вы желаете. Почему вы не вставляете имя дня в div, который вращается с диапазоном? –

взгляд это solution я добавил событие на прикосновении, так что если вы двигаетесь, с помощью мыши, содержание справа или Слева вы можете увидеть изменения содержимых «улуа-дату». может быть, это может быть способом изменить содержание заголовка, когда изменение слайдера.

$('.calendar').on('swipe', function(event, slick, direction){ 
    console.log(direction); 
    $('.cale-date').html(direction); 
});

источник

2016-06-10 16:24:21

Slick Slider Поместите текст над каждым слайдом

ответ

Смежные вопросы