search

ka215 / jquery.timeline

You can easily create the horizontal timeline with two types by using this jQuery plugin.
MIT License
240 stars 43 forks source link

Events not displaying.. #62

Open everythingability opened 4 years ago

everythingability commented 4 years ago

It all seems fine... loads, and renders but...

<ul class="timeline-events">

   <li data-timeline-node="{start:'2020-09-12 13:00',end:'2020-09-12 13:30',row:0,bgColor:'#75ea3c',color:'#101010',label:'Interview Slot',content:''}">
      <span class="event-label">Interview Slot</span>
      <span class="event-content"><p>Please arrive promptly
Wear something smart</p></span>
      <div class="timeline-event-view">Interview Slot</div>
   </li>

   <li data-timeline-node="{start:'2020-09-13 12:00',end:'2020-09-13 12:30',row:1,bgColor:'#75ea3c',color:'#101010',label:'Interview Slot',content:''}">
      <span class="event-label">Interview Slot</span>
      <span class="event-content"><p>Please arrive promptly
Wear something smart</p></span>
      <div class="timeline-event-view">Interview Slot</div>
   </li>

   <li data-timeline-node="{start:'2020-09-13 13:00',end:'2020-09-13 17:30',row:2,bgColor:'#75ea3c',color:'#101010',label:'Random meeting that will drag on too long',content:''}">
      <span class="event-label">Random meeting that will drag on too long</span>
      <span class="event-content"><p>Yawn!</p></span>
      <div class="timeline-event-view">Random meeting that will drag on too long</div>
   </li>

   <li data-timeline-node="{start:'2020-09-13 14:00',end:'2020-09-13 14:30',row:3,bgColor:'#75ea3c',color:'#101010',label:'A Random Meeting (with biscuits)',content:''}">
      <span class="event-label">A Random Meeting (with biscuits)</span>
      <span class="event-content"><p>Please bring biscuits</p></span>
      <div class="timeline-event-view">A Random Meeting (with biscuits)</div>
   </li>

   <li data-timeline-node="{start:'2020-09-13 15:00',end:'2020-09-13 15:30',row:4,bgColor:'#75ea3c',color:'#101010',label:'Interview Slot',content:''}">
      <span class="event-label">Interview Slot</span>
      <span class="event-content"><p>Please arrive promptly
Wear something smart</p></span>
      <div class="timeline-event-view">Interview Slot</div>
   </li>
     </ul>

I get this... only one green line... https://www-users.york.ac.uk/~tas509/Timeline__tom_smith_york_ac_uk.jpg

ka215 commented 3 years ago

Hi there,

The "scale" option of your timeline seems to remain at the default "day". Try setting the scale to "hour".