Flik – Timeline 10 Style with Generator

Flik – Timeline 10 Style with Generator

This is very simple and modern CSS3 and jQuery. 10 style with 8 different effect
Features :

  • Full responsive
  • 10 Style
  • 8 different effect
  • Pure CSS3
  • Works with all CSS3 Browsers
  • Easy to implement, customize and style

Using :

<

Version 1.3</

09.06.2016 1. Added GENERATOR page 2.Updated slider to responsive slider BxSlider 3.Added flikTimeline plugin $(’.myTimeline’).flikTimeline();

  • Properties

    • styleyou can change timeline style
    • effectyou can change timeline scroll effect All effects :
      • basic
      • bounce
      • slideRightLeft
      • slideLeftRight
      • flip
      • transformation
      • slideDownUp
      • slideUpDown
    • showDateshow or hide date in timeline
    • showTitleshow or hide title in timeline
    • loadingMessageshow loading message when timeline generating
    • delayif you want generate timeline after 6s ,you can use this property Example
      delay:6000
    • requestDatayou can get timeline data from anywhere ( data should be json )
       
      requestData: { type: 'GET', url: 'json data url', data: '', onRequestDone: function (data) { console.log('onRequestDone') }, onRequestFail: function (e) { console.log('onRequestFail'); } 
    • dataFromSourceif you want load data from static json, you should use this property
    • accordionif you use timeline style9, you can use accordion effect
  • Events
    • init() If you want to init or reload timeline you can use init function
      
      var flik = $('.myTimeline').flikTimeline();
      flik.init()
      
    • setEffect(‘effect name’) If you want to change effect after create timeline,you can use like this
      
      var flik = $('.myTimeline').flikTimeline();
      flik.setEffect('effect name');
      
    • setDelay(delay time) If you want to change delay after create timeline,you can use like this
      
      var flik = $('.myTimeline').flikTimeline();
      flik.setDelay(delay time);
      
    • setLoadingMessage(your loading message) If you want to change loading message after create timeline,you can use like this
      
      var flik = $('.myTimeline').flikTimeline();
      flik.setLoadingMessage(your loading message);
      
    • setShowDate(true or false) If you want to change setShowDate after create timeline,you can use like this
      
      var flik = $('.myTimeline').flikTimeline();
      flik.setShowDate(true or false)
      
    • setShowTitle(true or false) If you want to change setShowTitle after create timeline,you can use like this
      
      var flik = $('.myTimeline').flikTimeline();
      flik.setShowTitle(true or false)
      

<

Version 1.2</

03.05.2016 1. Added new style (style-10) <

Version 1.1</

25.04.2016 1. Added new style (style-9) 2. Added new 3 scroll effect

  • flip-effect
  • slide-up-down-effect
  • transformation-effect

3. Fixed some bugs
AFTER PURCHASES, PLEASE GIVE REVIEW AND RATE IT – THANK YOU

More items by askerov

Flik - Timeline 10 Style with Generator Grumpy - Multi Step Indicator 60 Style Yakuza - Modern BreadCrumbs Material Modern Chat MVC Image Processing