How to implement a modal window in Joomla component

The example in this article describes how to pop up a modal window in Joomla components. Share it with everyone for your reference, the details are as follows:

The most critical JS is in /media/system/js/modal.js. There are two ways to achieve it. All you need to modify is the template file default.php of the extension component.

Method 1:

<a rel="{handler: 'iframe', size: {x: 570, y: 400}}" href="/index.php">view</a>

It’s as simple as that. Joomla! will handle the rest for you. . Be happy!

Method 2:

<script src="/media/system/js/modal.js"></script>
<link rel="stylesheet" href="/media/system/css/modal.css" type="text/css">
<a>
<script>
 function f() {
   SqueezeBox.fromElement(null, {handler: 'iframe', size: {x: 570, y: 400}, href:'/index.php'});
};
</script>

</a>

Generally it is better to use the first method. If you want to study how modal.js is implemented, the second method is an introductory example.

Readers who are interested in more Joomla related content can check out the special topics of this site: "Introduction to Yii Framework and Summary of Common Techniques", "Summary of Excellent PHP Development Framework", "Basic Tutorial for Getting Started with Smarty Templates", "Summary of Common Methods of ThinkPHP" , "php object-oriented programming introductory tutorial", "php string (string) usage summary", "php+mysql database operation introductory tutorial" and "php common database operation skills summary"

I hope that what this article describes will be helpful to everyone based on joomla Programming helps.

The above introduces the method of popping up a modal window in Joomla components, including the relevant content. I hope it will be helpful to friends who are interested in PHP tutorials.