Scaled down images in Jcarousel

[jforjava1981]

I am using basic version of Jcarousel, I want to use scaled down versions of images in jcaraousel without using fixed height and width. I will be using 200px as max width for each scaled down image. I am not able to fix this as I am not a CSS expert. Please find below code i am using [id^=caraouselimageContainer] { max-width: 200px; } [id^=caraouselimageContainer] img{ max-width:100%; max-height:200px; width: auto; height: auto; }

    <div class="jcarousel-wrapper">
            <div class="jcarousel">
                <ul>
                     <c:forEach var="itemImageDTO" items="${item.itemImageDTOList}" varStatus="cnt">
                        <li><div id="caraouselimageContainer_${cnt}">
                                <img  src="${pageContext.request.contextPath}${imgItemPath}/${itemImageDTO.itemImageNameOnServer}"></img>
                            </div>
                        </li>   
                    </c:forEach>
                </ul>
            </div>
            <a href="#" class="jcarousel-control-prev">&lsaquo;</a>
            <a href="#" class="jcarousel-control-next">&rsaquo;</a>
         </div> 

Can you please help me with this ?

[jforjava1981]

Was able to resolve this. there were some problem in my config, i was setting it vertical as true

[jforjava1981]

Here is the modification I did :

.jcarousel-wrapper{ height:auto; }

.jcarousel li{
   margin: 5px;
}

.jcarousel-control-prev, .jcarousel-control-next { top:40px; }

Now if I have 4 images of 200px (scaled down) then last image is not moved forward in to viewing area in its entirety and next button remains active. When I click next once more then entire image is moved forward any idea?

[snake-345]

Do you have a link to an example? Maybe you can setup it on codepen?

[jforjava1981]

Will try to set it up today. the page is in proprietory website. But will try to create a plunker of sorts