Best Way to Optimize Scrollview for Different Devices?

2 posts, 0 answers
  1. Michael Zeppieri
    Michael Zeppieri avatar
    2 posts
    Member since:
    Aug 2013

    Posted 10 Feb 2014 Link to this post

    I've been exploring the use of a scrollview on the default page of our app. I'm trying to scale the image to 100% of the device width. This can easily be done, however, the height is the hang up. Either my image gets cut off and pager is behind the image if my data-content-height="" is set too low, or the pager appears too low in the screen. There has to be an easier way to do this. I have experimented with using @media queries, but it seems to be a bit quirky and to make it perfect for every device is a very intensive task. Is there a good example of how this is done out there?
  2. Alexander Valchev
    Alexander Valchev avatar
    2895 posts

    Posted 12 Feb 2014 Link to this post

    Hi Michael,

    The ScrollView can be scaled to take the whole View's height and width by:

    • making the View stretched
    • placing the ScrollView element as a direct child of the View container.
    • setting the contentHeight to 100%

    The pager is not visible due to a bug in the current version. This issue is logged and will be fixed in the Q1 2014 release.
    As a temporary workaround I can suggest you to move the pager element ( up by setting a negative margin-top through CSS rule.

    Alexander Valchev
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top