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?
thanks
1 answer
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 { display:block }
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:
<li>
<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>
</li>
change it to
PHP Code:
<li>
<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>
</li>
I hope it helps !