Responsive full screen slideshows with 'swipe' action.
For IE6+, Firefox, Opera, Safari, Chrome, iOS, Android OS, tablets, smartphones including Windows WP8, touch screens etc.
v2.1 - 23/08/13 - Option to have left/right click arrows on slides.
v2.0 - 22/08/13 - IE7 and IE8 supported with image sizing. It also works in IE6 though the png graphics are not supported.
v1.3 - 20/08/13 - IE7 and IE8 support added - but no background image sizing.
v1.2 - 20/08/13 - IE9 animation added
v1.1 - 19/08/13 - Small update to monitor mousemove/touchmove with mousedown/touchdown to control swipe action.
v1.0 - 16/08/13 - First release
- Click any of the three images above to see that set of images. If you are using a PC or Mac the click the slide image and move left/right to swipe to the next/previous image.
- To close an image set just click/tap the close icon at the bottom center of the image.
- Centered below each slide is an indication of the number of slides in the set and your current slide.
- A caption can be added to each image and will be shown centered above the image.
- The slides can contain images and/or text.
- I have the first slide in each set as a text slide to show how this will look. The content of this slide is vertical/horizontal centered.
- Slide sizes can be individually styled as cover, contain or auto to fill the browser window, fit within the browser window or be actual size. The Singapore and Australia slides are set to cover and the New Zealand slides to contain.
- Image sizes can be produced to suit the browser size and in this demo I have three sizes that are selected by @media queries to suit the browser window size.
- The jQuery and CSS used is very minimal and can be easily altered to suit your requirements.
- The animation is done using CSS transitions and is smoothed using 3D transforms for browsers that support this feature. So in the iPad, iPhone the scrolling is very smooth.
- The slideshow is responsive and will reconfigure when changing from portrait to landscape orientation on tablets and smartphones.
- All photographs ©2013 Stu Nicholls