Display all thumbnails on product page

[hotice]

Hello,

 

If you look at this page, http://www.esmartway.ro/femei/imbracaminte/tricouri/lady-fit-original-t-9265.html you'll see that when pressing the right arrow to see more thumbnails, only 6 thumbs are scrolled there. But, if you look in the source of the page, in <div id="thumbs_list">, there are about 20 thumbnails loaded from the database:

<div id="views_block" class="clearfix ">
	<span class="view_scroll_spacer">
		<a id="view_scroll_left" class="" title="Other views" href="javascript:{}"></a>
	</span>
	<div id="thumbs_list">
		<ul id="thumbs_list_frame">
			<li id="thumbnail_46445">
				<a href="http://www.esmartway.ro/46445-thickbox_default/lady-fit-original-t.jpg" data-fancybox-group="other-views" class="fancybox shown" title="Lady-fit original T">
					<img class="img-responsive" id="thumb_46445" src="http://www.esmartway.ro/46445-small_default/lady-fit-original-t.jpg" alt="Lady-fit original T" title="Lady-fit original T" height="68" width="68" itemprop="image" data-pagespeed-url-hash="4284899096" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"/>
				</a>
			</li>
			<li id="thumbnail_46446">
				<a href="http://www.esmartway.ro/46446-thickbox_default/lady-fit-original-t.jpg" data-fancybox-group="other-views" class="fancybox" title="Lady-fit original T">
					<img class="img-responsive" id="thumb_46446" src="http://www.esmartway.ro/46446-small_default/lady-fit-original-t.jpg" alt="Lady-fit original T" title="Lady-fit original T" height="68" width="68" itemprop="image" data-pagespeed-url-hash="2185667953" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"/>
				</a>
			</li>
			<li id="thumbnail_46447">
				<a href="http://www.esmartway.ro/46447-thickbox_default/lady-fit-original-t.jpg" data-fancybox-group="other-views" class="fancybox" title="Lady-fit original T">
					<img class="img-responsive" id="thumb_46447" src="http://www.esmartway.ro/46447-small_default/lady-fit-original-t.jpg" alt="Lady-fit original T" title="Lady-fit original T" height="68" width="68" itemprop="image" data-pagespeed-url-hash="86436810" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"/>
				</a>
			</li>
			<li id="thumbnail_46448">
				<a href="http://www.esmartway.ro/46448-thickbox_default/lady-fit-original-t.jpg" data-fancybox-group="other-views" class="fancybox" title="Lady-fit original T">
					<img class="img-responsive" id="thumb_46448" src="http://www.esmartway.ro/46448-small_default/lady-fit-original-t.jpg" alt="Lady-fit original T" title="Lady-fit original T" height="68" width="68" itemprop="image" data-pagespeed-url-hash="2282172963" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"/>
				</a>
			</li>
			<li id="thumbnail_46449">
				<a href="http://www.esmartway.ro/46449-thickbox_default/lady-fit-original-t.jpg" data-fancybox-group="other-views" class="fancybox" title="Lady-fit original T">
					<img class="img-responsive" id="thumb_46449" src="http://www.esmartway.ro/46449-small_default/lady-fit-original-t.jpg" alt="Lady-fit original T" title="Lady-fit original T" height="68" width="68" itemprop="image" data-pagespeed-url-hash="182941820" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"/>
				</a>
			</li>
			<li id="thumbnail_46450">
				<a href="http://www.esmartway.ro/46450-thickbox_default/lady-fit-original-t.jpg" data-fancybox-group="other-views" class="fancybox" title="Lady-fit original T">
					<img class="img-responsive" id="thumb_46450" src="http://www.esmartway.ro/46450-small_default/lady-fit-original-t.jpg" alt="Lady-fit original T" title="Lady-fit original T" height="68" width="68" itemprop="image" data-pagespeed-url-hash="1774780134" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"/>
				</a>
			</li>
			<li id="thumbnail_46451">
				<a href="http://www.esmartway.ro/46451-thickbox_default/lady-fit-original-t.jpg" data-fancybox-group="other-views" class="fancybox" title="Lady-fit original T">
					<img class="img-responsive" id="thumb_46451" src="http://www.esmartway.ro/46451-small_default/lady-fit-original-t.jpg" alt="Lady-fit original T" title="Lady-fit original T" height="68" width="68" itemprop="image" data-pagespeed-url-hash="3970516287" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"/>
				</a>
			</li>
			<li id="thumbnail_46452">
				<a href="http://www.esmartway.ro/46452-thickbox_default/lady-fit-original-t.jpg" data-fancybox-group="other-views" class="fancybox" title="Lady-fit original T">
					<img class="img-responsive" id="thumb_46452" src="http://www.esmartway.ro/46452-small_default/lady-fit-original-t.jpg" alt="Lady-fit original T" title="Lady-fit original T" height="68" width="68" itemprop="image" data-pagespeed-url-hash="1871285144" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"/>
				</a>
			</li>
			<li id="thumbnail_46453">
				<a href="http://www.esmartway.ro/46453-thickbox_default/lady-fit-original-t.jpg" data-fancybox-group="other-views" class="fancybox" title="Lady-fit original T">
					<img class="img-responsive" id="thumb_46453" src="http://www.esmartway.ro/46453-small_default/lady-fit-original-t.jpg" alt="Lady-fit original T" title="Lady-fit original T" height="68" width="68" itemprop="image" data-pagespeed-url-hash="4067021297" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"/>
				</a>
			</li>
			<li id="thumbnail_46454">
				<a href="http://www.esmartway.ro/46454-thickbox_default/lady-fit-original-t.jpg" data-fancybox-group="other-views" class="fancybox" title="Lady-fit original T">
					<img class="img-responsive" id="thumb_46454" src="http://www.esmartway.ro/46454-small_default/lady-fit-original-t.jpg" alt="Lady-fit original T" title="Lady-fit original T" height="68" width="68" itemprop="image" data-pagespeed-url-hash="1967790154" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"/>
				</a>
			</li>
			<li id="thumbnail_46455">
				<a href="http://www.esmartway.ro/46455-thickbox_default/lady-fit-original-t.jpg" data-fancybox-group="other-views" class="fancybox" title="Lady-fit original T">
					<img class="img-responsive" id="thumb_46455" src="http://www.esmartway.ro/46455-small_default/lady-fit-original-t.jpg" alt="Lady-fit original T" title="Lady-fit original T" height="68" width="68" itemprop="image" data-pagespeed-url-hash="4163526307" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"/>
				</a>
			</li>
			<li id="thumbnail_46456">
				<a href="http://www.esmartway.ro/46456-thickbox_default/lady-fit-original-t.jpg" data-fancybox-group="other-views" class="fancybox" title="Lady-fit original T">
					<img class="img-responsive" id="thumb_46456" src="http://www.esmartway.ro/46456-small_default/lady-fit-original-t.jpg" alt="Lady-fit original T" title="Lady-fit original T" height="68" width="68" itemprop="image" data-pagespeed-url-hash="2064295164" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"/>
				</a>
			</li>
			<li id="thumbnail_46457">
				<a href="http://www.esmartway.ro/46457-thickbox_default/lady-fit-original-t.jpg" data-fancybox-group="other-views" class="fancybox" title="Lady-fit original T">
					<img class="img-responsive" id="thumb_46457" src="http://www.esmartway.ro/46457-small_default/lady-fit-original-t.jpg" alt="Lady-fit original T" title="Lady-fit original T" height="68" width="68" itemprop="image" data-pagespeed-url-hash="4260031317" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"/>
				</a>
			</li>
			<li id="thumbnail_4[spam-filter]">
				<a href="http://www.esmartway.ro/4[spam-filter]-thickbox_default/lady-fit-original-t.jpg" data-fancybox-group="other-views" class="fancybox" title="Lady-fit original T">
					<img class="img-responsive" id="thumb_4[spam-filter]" src="http://www.esmartway.ro/4[spam-filter]-small_default/lady-fit-original-t.jpg" alt="Lady-fit original T" title="Lady-fit original T" height="68" width="68" itemprop="image" data-pagespeed-url-hash="2160800174" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"/>
				</a>
			</li>
			<li id="thumbnail_46459">
				<a href="http://www.esmartway.ro/46459-thickbox_default/lady-fit-original-t.jpg" data-fancybox-group="other-views" class="fancybox" title="Lady-fit original T">
					<img class="img-responsive" id="thumb_46459" src="http://www.esmartway.ro/46459-small_default/lady-fit-original-t.jpg" alt="Lady-fit original T" title="Lady-fit original T" height="68" width="68" itemprop="image" data-pagespeed-url-hash="61569031" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"/>
				</a>
			</li>
			<li id="thumbnail_46460">
				<a href="http://www.esmartway.ro/46460-thickbox_default/lady-fit-original-t.jpg" data-fancybox-group="other-views" class="fancybox" title="Lady-fit original T">
					<img class="img-responsive" id="thumb_46460" src="http://www.esmartway.ro/46460-small_default/lady-fit-original-t.jpg" alt="Lady-fit original T" title="Lady-fit original T" height="68" width="68" itemprop="image" data-pagespeed-url-hash="1653407345" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"/>
				</a>
			</li>
			<li id="thumbnail_46461">
				<a href="http://www.esmartway.ro/46461-thickbox_default/lady-fit-original-t.jpg" data-fancybox-group="other-views" class="fancybox" title="Lady-fit original T">
					<img class="img-responsive" id="thumb_46461" src="http://www.esmartway.ro/46461-small_default/lady-fit-original-t.jpg" alt="Lady-fit original T" title="Lady-fit original T" height="68" width="68" itemprop="image" data-pagespeed-url-hash="3849143498" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"/>
				</a>
			</li>
			<li id="thumbnail_46462">
				<a href="http://www.esmartway.ro/46462-thickbox_default/lady-fit-original-t.jpg" data-fancybox-group="other-views" class="fancybox" title="Lady-fit original T">
					<img class="img-responsive" id="thumb_46462" src="http://www.esmartway.ro/46462-small_default/lady-fit-original-t.jpg" alt="Lady-fit original T" title="Lady-fit original T" height="68" width="68" itemprop="image" data-pagespeed-url-hash="1749912355" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"/>
				</a>
			</li>
			<li id="thumbnail_46463">
				<a href="http://www.esmartway.ro/46463-thickbox_default/lady-fit-original-t.jpg" data-fancybox-group="other-views" class="fancybox" title="Lady-fit original T">
					<img class="img-responsive" id="thumb_46463" src="http://www.esmartway.ro/46463-small_default/lady-fit-original-t.jpg" alt="Lady-fit original T" title="Lady-fit original T" height="68" width="68" itemprop="image" data-pagespeed-url-hash="3945648508" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"/>
				</a>
			</li>
			<li id="thumbnail_46464">
				<a href="http://www.esmartway.ro/46464-thickbox_default/lady-fit-original-t.jpg" data-fancybox-group="other-views" class="fancybox" title="Lady-fit original T">
					<img class="img-responsive" id="thumb_46464" src="http://www.esmartway.ro/46464-small_default/lady-fit-original-t.jpg" alt="Lady-fit original T" title="Lady-fit original T" height="68" width="68" itemprop="image" data-pagespeed-url-hash="1846417365" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"/>
				</a>
			</li>
			<li id="thumbnail_46465">
				<a href="http://www.esmartway.ro/46465-thickbox_default/lady-fit-original-t.jpg" data-fancybox-group="other-views" class="fancybox" title="Lady-fit original T">
					<img class="img-responsive" id="thumb_46465" src="http://www.esmartway.ro/46465-small_default/lady-fit-original-t.jpg" alt="Lady-fit original T" title="Lady-fit original T" height="68" width="68" itemprop="image" data-pagespeed-url-hash="4042153518" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"/>
				</a>
			</li>
			<li id="thumbnail_46466" class="last">
				<a href="http://www.esmartway.ro/46466-thickbox_default/lady-fit-original-t.jpg" data-fancybox-group="other-views" class="fancybox" title="Lady-fit original T">
					<img class="img-responsive" id="thumb_46466" src="http://www.esmartway.ro/46466-small_default/lady-fit-original-t.jpg" alt="Lady-fit original T" title="Lady-fit original T" height="68" width="68" itemprop="image" data-pagespeed-url-hash="1942922375" onload="pagespeed.CriticalImages.checkImageForCriticality(this);"/>
				</a>
			</li>
		</ul>
	</div> <!-- end thumbs_list -->
	<a id="view_scroll_right" title="Other views" href="javascript:{}"></a>
</div> <!-- end views-block -->

So, is there any way, when pressing the right arrow, to scroll through all the thumbnails? I looked through product.tpl, producs.js and producs.css and I didn't find anything to change to scroll all the thumbnails. I just found how to change the step of the scroll...

 

Cheers,

Adrian

[tdr170]

In product.css you will need to increase the frame width

 

#thumbs_list ul#thumbs_list_frame {

    height: 104px;

    list-style-type: none;

    overflow: hidden;

    padding-left: 0;

    width: 594px;}        try increasing untill all images show when scrolling start at 1500

[hotice]

 

In product.css you will need to increase the frame width

 

#thumbs_list ul#thumbs_list_frame {

    height: 104px;

    list-style-type: none;

    overflow: hidden;

    padding-left: 0;

    width: 594px;}        try increasing untill all images show when scrolling start at 1500

 

 

It worked like a charm! Many thanks!