To open compare item page in modal window we need to edit file ‘sidebar.phtml’ path given below
template/catalog/product/compare/sidebar.phtml
add the following js at the end of sidebar.phtml
<script type="text/javascript">// <![CDATA[
function showCompare(url) {
winCompare = new Window({className:'magento',title:'Compare Products',url:url,width:820,height:600,minimizable:false,maximizable:false,showEffectOptions:{duration:0.4},hideEffectOptions:{duration:0.4}});
winCompare.setZIndex(100);
winCompare.showCenter(true);
}
// ]]></script>
we also need to edit like
<button class="button" title="<?php echo $this->__('Compare') ?>" onclick="popWin('<?php echo $_helper->getListUrl() ?>','compare','top:0,left:0,width=820,height=600,resizable=yes,scrollbars=yes')" type="button"></button>
With
<button class="button" title="<?php echo $this->__('Compare') ?>" onclick="showCompare('<?php echo $this->helper('catalog/product_compare')->getListUrl() ?>')" type="button"></button>
This is due to some of the links like Add to Cart and Add to Wishlist use setPLocation to set the target page URL.
This won’t work in our pop-up since window.js loads the page into an iframe.
So the remedy is to override the product/compare/list.phtml and add:
<script type="text/javascript">
// <![CDATA[
function setILocation(url){
window.parent.location.href = url;
}
// ]]>
</script>
Then replace all setPLocation calls with setILocation. and you are done

2 comments
jarod says:
December 4, 2011 at 4:35 pm (UTC 5.5)
You should also mention about adding window.js and css files to page head
admin says:
December 4, 2011 at 6:58 pm (UTC 5.5)
Magento works on prototype.js and window.js and its css already included no need to add those files