concrete5 :: Remo's Zoom Image Block

Remo's Zoom Image Block

February 26, 2010 at 4:29 AM

I am trying to use this block on this site i am working on
http://www.intheframestudio.com/psp/2level/press-news/mumbai/burrp/...

If you check it you shall notice that the Zoom image gets overlapped by the footer in the bottom and also by the thumb image on the left-side. I realize that this is an issue relating to z-index. So, I tried adding a z-index: 1000000 to the #zoomimage within the view.php file, but nothing seems to work. Below is the code

<?php   
defined('C5_EXECUTE') or die(_("Access Denied."));
$version_arr = explode('.', APP_VERSION);
if ($version_arr[1] < 2) die("This block doesn't support Concrete" . APP_VERSION);
if ($version_arr[1] == 2) {
   $fo        = $controller->getAssetFileObject();
   $fileName  = $fo->getFileRelativePath();
   $thumbnail = $fo->getThumbnail(intval($controller->thumbnailWidth), intval($controller->thumbnailHeight));
}
else {
   $ih = Loader::helper('image');
   $fo = $controller->getFileObject();
   $fileName = $fo->getRelativePath();
   $thumbnail = $ih->getThumbnail($fo,intval($controller->thumbnailWidth), intval($controller->thumbnailHeight));
}

Viewing 15 lines of 36 lines. View entire code block.

<?php   
defined('C5_EXECUTE') or die(_("Access Denied."));
 
$version_arr = explode('.', APP_VERSION);
 
if ($version_arr[1] < 2) die("This block doesn't support Concrete" . APP_VERSION);
if ($version_arr[1] == 2) {
   $fo        = $controller->getAssetFileObject();
 
   $fileName  = $fo->getFileRelativePath();
   $thumbnail = $fo->getThumbnail(intval($controller->thumbnailWidth), intval($controller->thumbnailHeight));
}
else {
   $ih = Loader::helper('image');
   $fo = $controller->getFileObject();
 
   $fileName = $fo->getRelativePath();
   $thumbnail = $ih->getThumbnail($fo,intval($controller->thumbnailWidth), intval($controller->thumbnailHeight));
}
?>
<style type="text/css">
 
.zoomImage img {
   /*   background-color: #111;*/
   padding-top: 10px;
   padding-right: 10px;
   padding-bottom: 10px;
   padding-left: 10px;
   border: thin solid #333;
 
}
 
#zoomImage {
   z-index: 100000;
 
}
 
</style>
 
 
<a class="zoomImage" href="#zoomImage<?php   echo $bID;?>"><img src="<?php   echo $thumbnail->src;?>" alt="<?php   echo $controller->altText; ?>"/></a>
 
<div id="zoomImage<?php   echo $bID;?>">
   <img src="<?php   echo $fileName;?>" alt="<?php   echo $controller->altText; ?>"/>
   <?php  if ($controller->displayCaption): ?>
     <p id="zoomImage<?php  echo $bID;?>_caption"><?php  echo $controller->altText; ?></p>
   <?php  endif; ?>
</div>