If we are required to show a popup in our Magento page for say we want to show the details of the product from the list of products in a popup we can do it using Magento 1.9.x features.

In Magento 1.9.x we have window.js file, the file can be found at the path magento/js/prototype/window.js. Include  this and these  default.css, magento.css css files to work on popup.

To include these files in  local.xml write the below code,

<reference name="head">
   <action method="addItem"><type>js</type><name>prototype/window.js</name></action>
           <action method="addItem"><type>js_css</type>
           <name>prototype/windows/themes/default.css</name></action>             
           <action method="addCss"><name>lib/prototype/windows/themes/magento.css</name></action>
</reference>

then suppose we need to add the popup in our product list, we can add a link or button in the loop of list.phtml page to append the button or link below the products so that it will appear below every product.

The link or the button will have the onclick function which does the work of displaying the popup on the parent window. Add the below code in loop to add the link or button in product list,

<a title="<?php echo $this->quoteEscape($this->__('Quick View')) ?>" onclick="showCompare('<?php echo $_product->getProductUrl() ?>')" ><?php echo $this->__('Quick View') ?></a>

the above link has the onclick="ShowPopup('<?php echo $_product->getProductUrl() ?>')" it will call the ShowPopup() function and pass it the url of the product.

The function definition is as ,

function ShowPopup(url) {
           
                   var winCompare = new Window({
                        className:'magento',
                        title:'View Details',
                        url:url,
                        destroyOnClose: true,
                        recenterAuto:false, 
                        resizable: false,
                        width:720,
                        height:500,
                        minimizable:true,
                        maximizable:true,
                        closable:true,
                        header: false,
                        showEffectOptions:{duration:0.4},
                        hideEffectOptions:{duration:0.4}
                    });
                    winCompare.setZIndex(100);
                    winCompare.showCenter(true);
                    winCompare.focus();
            }

Write the above code in the script. The var winCompare = new Window({}); will create the popup on the screen and load the url which is passed to it in the popup window. The other attributes are to give the property to the window popup.