Scroll does not work when used along with a tabstrip

[devApps]

Dear Team ,

Here is a dojo where I have a simple scroll view working fine

Basic Scroll View Working Fine :http://dojo.telerik.com/OfUbI

When I use the scroll view along with a tabstrip ,the scroll does not work, it does not even show the pager

Scroll Not working with tabstrip : http://dojo.telerik.com/uDeZO/3

Another Issue I have is that when I have multiple images of different sizes in the scroll-view the scroll-view takes the height of the largest image.

Is there any way that this can be made dynamic such that the pager appears directly below the image with small size without leaving blank space in between ?

Or can the smaller images be automatically resized to fit the height of the largest image of the scroll view

Here is the sample for the same : Scroll with different size images

 

[Tsvetina]

Hello,

The first problem happens because the ScrollView has an initial setting of display:none and the pager size and position cannot be correctly calculated. You can call the ScrollView refresh method when you make the widget visible, to allow it to correctly size.

You can see the modified Dojo here:
http://dojo.telerik.com/@tsveti/oYOlU

With regard to sizing the ScollView, you can only set it a fixed content size in your scenario, using the contentHeight property. However, this will not resize the images. The actual image height depend on the img elements settings. You can set a hard-coded height and each image will scale to fit inside it:
http://dojo.telerik.com/@tsveti/efUCi

Another option is to set a max-height for the images using CSS and apply the same number as ScrollView content height. In this way smaller images will not be resized:
http://dojo.telerik.com/@tsveti/ejuca/2

Regards,
Tsvetina
Telerik by Progress

[devApps]

Thanks again for solving this issue.