Product additional images to show on mobile device

In the full view version the additional product images can be seen below the main product image.

How can I get these to show when viewed on a mobile device such as a smartphone?


1 answer

Profile photo of Sherlock 0.00 $tone February 28, 2013

Hi tweed,

You open the file of skin/frontend/default/jm_neros/css/layout-mobile.css add this css rule

HTML Code:

  #ja-col2, .zoom {

Then open the file of app\design\frontend\default\jm_nerostemplate\cata log\product\view\media.phtml
Look for this code at the bottom

PHP Code:

            <a href="#" onclick="popWin('<?php echo $this->getGalleryUrl($_image?>', 'gallery', 'width=300,height=300,left=0,top=0,location=no,status=yes,scrollbars=yes,resizable=yes'); return false;" title="<?php echo $this->htmlEscape($_image->getLabel()) ?>"><img src="<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'thumbnail'$_image->getFile())->resize(70); ?>" width="70" height="70" alt="<?php echo $this->htmlEscape($_image->getLabel()) ?>" /></a>

change it to

PHP Code:

            <a href="<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'image'$_image->getFile()); ?>" onclick="$('image').src = this.href; return false;"  title="<?php echo $this->htmlEscape($_image->getLabel()) ?>"><img src="<?php echo $this->helper('catalog/image')->init($this->getProduct(), 'thumbnail'$_image->getFile())->resize(70); ?>" width="70" height="70" alt="<?php echo $this->htmlEscape($_image->getLabel()) ?>" /></a>

I hope it helps !


Please login or Register to Submit Answer

Written By