jQuery Thumbnail Scroller

Key Features

Click-Based Navigation

Simple and intuitive navigation using previous and next arrow buttons. Navigation buttons appear on hover for desktop users and are always visible on mobile and tablets for better usability. Smooth animated scrolling transitions when clicking navigation buttons.

Auto-Scroll Feature

Enable automatic scrolling to continuously loop through thumbnails without user interaction. Configure the number of loops or enable infinite scrolling (set to 0). Control auto-scrolling speed and delay between movements. Auto-scroll automatically pauses when users hover over the scroller.

Lightbox Integration

Click thumbnails to view full-size images in an elegant Fancybox lightbox overlay. Choose from elastic, fade, or none effects for opening and closing. Customize background color, border width, and close button visibility. Navigate between images directly within the lightbox gallery mode.

Smart Image Resizing

Images are automatically resized to thumbnail dimensions using Joomla's native Image class. Resized thumbnails are cached for improved performance and faster loading. Maintains original image aspect ratios for consistent display. Supports JPG, JPEG, PNG, GIF, and WebP formats.

Flexible Image Sources

Choose between folder-based or individual image selection. Automatically load all images from a specified folder for quick setup, or manually select individual images using a repeatable subform interface. Add custom titles/alt text for each image when using individual selection mode.

Fully Responsive Design

Fully responsive scroller that adapts seamlessly to all screen sizes from mobile to desktop. Set width using pixels or percentages for flexible layouts. Works perfectly on touch devices with native touch interactions and smooth scrolling. Navigation buttons are always visible on mobile and tablets for better usability.

Modern Joomla Compatibility

Fully compatible with Joomla 4, 5, and 6 without backward compatibility plugins. Uses WebAssetManager for modern asset loading. Optimized code following latest PHP and Joomla coding standards. Clean codebase with all unused code and dependencies removed for better performance.

Easy Configuration

Intuitive interface with clear parameter labels and descriptions. Streamlined parameter options focusing on essential features. Advanced customization options including custom CSS and module class suffix support.

Professional Presentation

Previous and next navigation buttons with hover effects for easy thumbnail navigation. Fluid scrolling animations and transitions for a professional user experience. Full control over scroller width and thumbnail height to match your design. Minimal, modern interface that integrates seamlessly with any website design.

Performance Optimized

Lightweight code with unnecessary dependencies removed for faster loading. Uses native browser scrolling for optimal performance across all devices. Thumbnails are cached to reduce server load and improve page speed. Smart resize handling ensures smooth performance on all screen sizes.

Use Cases

• Image Galleries: Display photo galleries with smooth scrolling and lightbox viewing
• Product Showcases: Showcase product images with elegant navigation
• Portfolio Displays: Present portfolio work with professional scrolling effects
• Event Galleries: Display event photos with auto-scroll functionality
• Testimonial Images: Combine images with smooth scrolling presentation

Technical Details

• Joomla Compatibility: Joomla 4.x, 5.x, and 6.x
• PHP Requirements: PHP 8.0 or higher
• Dependencies: jQuery (loaded via Joomla framework), Fancybox
• Image Formats: Supports JPG, JPEG, PNG, GIF, and WebP
• Browser Support: All modern browsers (Chrome, Firefox, Safari, Edge)

Installation & Configuration

1. Install the module via Joomla Extension Manager
2. Go to Extensions > Modules and find "jQuery Thumbnail Scroller"
3. Configure scroller settings (dimensions, scrolling speed, auto-scroll)
4. Choose image source (folder-based or individual images)
5. Configure lightbox settings (background, effects, border)
6. Publish to a module position

Support

For documentation, support, and updates, visit:
- Documentation: https://joomlax.com/documentation/jquery-thumbnail-scroller
- Support: https://support.joomlax.com
- Website: https://joomlax.com

License

GNU General Public License version 2 or later