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:1开发者_JS百科0,
minVelocity:0.3,
axis: "y"}
});
scrollview.render();
scrollView._uiDimensionsChange(); // Think I'm supposed to use this somehow.
});
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()
});
});
});
精彩评论