Yahoo yui and iPad orientation

I've just started developing some web application-like sites for iPad. I'm using YUI's scrollView for lists, which works nicely.

Now the problem is that when the orientation changes, I've got to update the scroller-instance's height, which I havn't got a clue how to accomplish.

As far sa I know, there should be some listeners and event args or something in my messy piece of code. Any ideas?

YUI().use("scrollview", function (Y) {


  if(window.orientation == 0) // Temp solution to set the right height on load.
        { var iheight = 740; }
    else if(window.orientation == 90 || window.orientation == -90)
        { var iheight = 480; }

    var scrollview = new Y.ScrollView({
        id: "scrollview",
        srcNode: '#scrollable',
        height: iheight,        
        flick: {
            minDistance:10,
            minVelocity:0.3,
            axis: "y"}
    });

    scrollview.render();

    scrollView._uiDimensionsChange(); // Think I'm supposed to use this somehow.
});

Answers:

Answer

To change the height, all you need to do is this:

scrollView.setAttrs({height: 500});

To execute that code when the orientation changes, this should work (though I can't test it since I'm not on a mobile browser):

YUI().use("scrollview", function (Y) {

    function getHeight() {
        switch (window.orientation) {
            case 0:
                return 740;
            case 90:
            case -90:
                return 480;
            default:
                return ???;
        }
    }

    var scrollview = new Y.ScrollView({
        id: "scrollview",
        srcNode: '#scrollable',
        height: getHeight(),        
        flick: {
            minDistance:10,
            minVelocity:0.3,
            axis: "y"}
    });

    scrollview.render();

    Y.on("orientationchange", function (e) {
    {
        scrollView.setAttrs({
            height: getHeight()
        });
    });
});

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.