Skip to content
This repository has been archived by the owner on Jul 15, 2020. It is now read-only.

mverissimo/tweenslideshow

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

23 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

A basic Tween slideshow

Create amazing fullpage:

Installation

###Step 1: Link required files

html

<!-- tuinslider Javascript file -->
<script src="/js/tuinslider.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/latest/TweenMax.min.js"></script>

###Step 2: Create HTML markup

html

<div class="slider" id="slider">
  <div class="slider__container">
    <div class="slider__item"><div class="slider__content"></div></div>
    <div class="slider__item"><div class="slider__content"></div></div>
    <div class="slider__item"><div class="slider__content"></div></div>
    <div class="slider__item"><div class="slider__content"></div></div>
  </div>
</div>

###Step 3: Call the FullPage

Call .TuinSlider() on <div id="slider">.

var slider = new TuinSlider("#slider");

##Options

slider selector

default: '.slider'
options: String

ease

default: 'SlowMo'
options: 'Power0', 'Power1', 'Elastic'

easeType

default: 'easeOut'
options: 'ease', 'easeIn'

For more options

duration

default: 1,
options: int

arrows

default: 'true',
options: boolean (true / false)

pagination

default: 'true',
options: boolean (true / false)

keyboard

default: 'true',
options: boolean (true / false)

##Methods

move()

page.move(index);

##Callbacks onLeave

default: null,
option: onLeave: function(index) {},

afterLoad

default: null,
option: afterLoad: function(index) {},

Gulp commands

  • gulp —— Default for task development
  • gulp --prod —— Task production
  • Access http://localhost:3000

Change log

Version 1.0.0

  • Support for internet explorer 9.

##Image license Pixel Squid

Contributing

Everyone is welcome to help contribute and improve this project. There are several ways you can contribute:

  • Reporting issues (please read issue guidelines)
  • Suggesting new features
  • Writing or refactoring code
  • Fixing issues

Version BETA

**I create this fullpage for study, sorry for any bugs, contribute with this repo. Thank's enjoy! **

License:

This boilerplate is free and open source software, distributed under the The MIT License. So feel free to use this to create your site without linking back to me or using a disclaimer.

About

A simple slideshow using Tweenmax

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published