JO Simple Modal is a powerful and flexible Joomla system plugin designed to automatically initialize modals for elements with a specified class. It provides a seamless way to enhance user interaction by displaying content in modal dialogs, making it easy to manage and customize modal behavior directly from the Joomla administrator panel.
Key Features:
★ Customizable Modal Trigger Class: Define a CSS class to trigger modals, allowing for flexible integration with existing content.
★ Show/Hide Modal Title: Enable or disable the display of the modal title based on your preference.
★ Theme Switcher (Dark/Light): Choose between light and dark themes to match your website's design.
★ Custom CSS: Add custom CSS to style the modal popup according to your needs.
★ Restrict Modal Functionality to Specific Menu IDs: Limit the modal functionality to specific menu items, enhancing control over where modals appear.
★ Modal Size Customization (Small, Medium, Large): Select from predefined sizes to fit different types of content.
★ Modal Position (Top, Center, Bottom): Position the modal at the top, center, or bottom of the screen for optimal visibility.
★ Animation Effects (Fade, Slide): Choose from fade or slide animations to enhance the user experience.
★ Preload Images: Preload images for faster display, improving the performance of image-based modals.
★ Support for Multiple Languages: Easily add support for multiple languages by including language files.
Frontend Demo:
Code Example:
<p><a href="/images/parallax-background.jpg" class="josmodal" data-title="Sample Image" data-width="800px" data-height="600px">Open Image in Modal </a></p>
<p><img src="/images/parallax-background.jpg" alt="Parallax Background" width="344" height="229" class="josmodal" /></p>
<p><img src="/images/parallax-background.jpg" alt="Click to open modal" width="344" height="229" class="josmodal" data-src="/images/parallax-background.jpg" data-title="Large Image" data-width="800px" data-height="600px" /></p>
<p><a href="/extensions/modules/jo-super-section" class="josmodal">Click</a></p>Backend Screenshot:
