Click this text to start textition
Transition occurs on the X axis
$('#axis-x').textition({
map: {x: 100, y: 0, z: 0}
})
First text
Second text
Third text
$('#autoplay').textition({
speed: 1,
animation: 'ease-out',
map: {x: 200, y: 100, z: 0},
autoplay: true,
interval: 1.5
})
First text
Second text
Third text
$('#axis-z').textition({
speed: 0.5,
map: {x: 0, y: 0, z: 100},
perspective: 30
})
$('#buttons a').each(function() {
$(this).textition({
speed: 0.7,
handler: 'mouseenter mouseleave'
})
});
With CSS3, we can add an effect when changing from one style to another, without using Flash animations or JavaScripts.
The effect will start when the specified CSS property changes value.
CSS3 transitions are effects that let an element gradually change from one style to another.
$('#sliding').textition({
speed: 0.5,
animation: 'ease-out',
map: {x: 0, y: 40, z: 0},
element: $('#arrow-next')
})