polymer-tilt

Parallax tilt hover effect for Polymer Component (based Polymer2)

View larger

Close

[ This description is mirrored from README.md at github.com/YingshanDeng/polymer-tilt on 2019-05-10 ]

<polymer-tilt>

Parallax tilt hover effect for Polymer Component, Inspired by gijsroge/tilt.js, A tiny 60+fps parallax tilt hover effect for jQuery.

Installation

bower install --save polymer-tilt

Usage

<polymer-tilt reset>
  <div slot="tilt" class="tilt">
    <div class="tilt-inner">Basic polymer-tilt demo</div>
  </div>
</polymer-tilt>

Options

maxTilt:        10,     // max tilt rotation (degrees)
perspective:    1000,   // Transform perspective, the lower the more extreme the tilt gets
easing:         "cubic-bezier(.03,.98,.52,.99)",    // Easing on enter/exit
scale:          1,      // 2 = 200%, 1.5 = 150%, etc..
speed:          300,    // Speed of the enter/exit transition
axis:           null,   // What axis should be disabled. Can be X or Y
reset:          false,  // If the tilt effect has to be reset on exit
glare:          false,  // Enables glare effect
maxGlare:       1       // From 0 - 1

License

MIT

Links

• Documentation
• View on GitHub
• GitHub Homepage
• Online Demo
• Issue tracker
• License

Compatibility