AP Smart LayerSlider (Style1)
Nullam mattis consectetur purus sit amet fermentum. Nullam quis risus eget urna mollis ornare vel eu leo nullam mollis ornare.
Sample html content goes here...
With some background...
Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam est.
AT THE MEETING...
Phasellus congue purus sit amet fermentum. Nullam quis vulputate eget urna mollis ornare vel.
SOMEBODY HAS TO TAKE NOTES...
Cras mattis consectetur purus sit amet fermentum. Etiam porta quis risus eget sem malesuada magna mollis.
RIGHT?
Pellentesque ornare sem lacinia quam venenatis vestibulum. Sed posuere consectetur est at lobortis. Donec ullamcorper nulla.
“Well, One Thing I Know..”
Gravida suscipit sem feugiat sollicitudin sapien. Sed posuere. Donec ullamcorper nulla.
“I Know It's time for Coffee”
Etiam mattis consectetur purus sit amet fermentum. Nullam quis risus eget urna mollis ornare vel eu leo nullam mollis ornare.
Donec ullamcorper nulla venenatis vestibulum. Porta sem malesuada magna mollis euismod Aenean.
Placerat Interdum felis vestibulum. Porta sem malesuada euismod. Aenean eu leo quam.
Nullam Quis Risus
Nullam mattis consectetur purus sit amet fermentum. Nullam quis risus ege
Lacinia Quam
Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consecte
Phasellus congue
Phasellus congue purus sit amet fermentum. Nullam quis vulputate eget urn
Etiam Porta Sem
Cras mattis consectetur purus sit amet fermentum. Etiam porta quis risus
Vestibulum
Pellentesque ornare sem lacinia quam venenatis vestibulum. Sed posuere co
Gravida Suscipit
Gravida suscipit sem feugiat sollicitudin sapien. Sed posuere. Donec ulla
Consectetur Purus
Etiam mattis consectetur purus sit amet fermentum. Nullam quis risus eget
Ullamcorper Sem
Donec ullamcorper nulla venenatis vestibulum. Porta sem malesuada magna m
Placerat Interdum
Placerat Interdum felis vestibulum. Porta sem malesuada euismod. Aenean e
Example: Style1
- Animated Layers. AP Smart LayerSlider supports layers, which are blocks of text or HTML content that can easily be positioned, sized or animated. Layers can be both animated and static and they can hold any HTML content like: text, links, buttons, images, DIVs, headings, etc. Also, layers can be scaled down automatically or with CSS.
- Wait For Layers. Indicates whether the slider will wait for the layers to disappear before going to a new slide. When you click on the thumbnails or arrows you will notice the slide transitioning only after the layers fade out. This feature is optional and the slides can transition immediately, as it happens when you swipe the slides.
- Auto Scale Layers features automatic scaling of the layers when the slider becomes smaller.
- Loop is enabled. Indicates if the slider will be loopable (infinite scrolling). Slider is loopable by default, but if you don't want for some reason to loop slides, it can be disabled.
- Text Thumbnails. Allows you to add text to thumbnails, which is basically "Title" and "Description". You can control maximum characters for the thumbnail description. Text inside the thumbnails can be set: Left, Center or Right, which is handy when it comes to LTR/RTL support for some languages. In this example "Text align (orientation)" is set to "Left". Also "Thumbnail Pointer" and "Thumbnail Arrows" are also enabled for this example, where you can set custom colors for thumbnails and pointer as well.
- Keyboard Navigation. Slider is "Keyboard Navigation" friendly as well. The arrow keys will move the slider to the next or previous slide.
