You may see this pop-ups in Joomla back-end, when changing settings etc.
Add to head:
<?php
JHtml::_('behavior.modal', 'a.class_name');
?>
<script type="text/javascript">
window.addEvent('domready', function() {
// Decorate the login windows to use a modal.
$ES('a.class_name').each(function(a){
a.setProperty('rel', '{size: {x: 900, y: 500}, ajaxOptions: {method: "get"}}');
if (a.getProperty('href').contains('?')) {
a.setProperty('href', a.getProperty('href')+'&tmpl=component');
} else {
a.setProperty('href', a.getProperty('href')+'?tmpl=component');
}
});
});
</script>
Then just add class attribute:
<a href="..." class="class_name">link text</a>
CSS-file located at:
/media/system/css/modal.css
JS-file located at:
/media/system/js/modal.js
explain it better
Where do you put this code?
Add to head = Add to head tag of your current template index.php.