Parallax hover tilt effect
}})
The most basic usage:
-
<script src="tilt.jquery.js')}}"></script> -
Mark your elements with
<span data-tilt"></span>
Parallax hover tilt effect
}})
How to Use:
- A tiny requestAnimationFrame powered 60+fps lightweight parallax hover tilt effect for jQuery.
-
Add
transform-style: preserve-3dto your tilt element. -
Add
transform: translateZ(20px)to your inner elements that have to pop out.
Glare effect:
}})
How to Use:
Setting this option will enable a glare effect. You can tweak the glare value with
{'maxGlare': .5}
$('.js-tilt').tilt({
glare: true,maxGlare: .5
})Keep floating:
}})
How to Use:
Setting this option will not reset the tilt element when the user mouse leaves the element.
$('.js-tilt').tilt({
reset: false
})Scale on hover
}})
How to Use:
Setting this option will scale tilt element on hover.$('.js-tilt').tilt({
scale: 1.2
})Disable Y axis
}})
The most basic usage:
Setting this option will disable the Y-Axis on the tilt element.$('.js-tilt').tilt({
axis: x
})Disable X axis
}})
The most basic usage:
Setting this option will disable the X-Axis on the tilt element.$('.js-tilt').tilt({
axis: Y
})