How to enable native scrolling in iOS5+ ??

edited October 2013 in Enyo 2
I need to know how to do this, I tried with simple css but this doesn't work:
.scroll {
	border: 2px solid blue;
	width: 250px;
  	height: 300px;
	overflow-y: scroll;
  	-webkit-overflow-scrolling: touch;
}
Then in my js:
 
{name: "scroll", classes: "scroll", components: [
	//....
]},
As I mentioned I only want to enable regular plain native iOS5 scrolling so I don't want to use enyo.scroller unless it also can handle native scrollling.

When load the app like this it works but then all the screen moves when I scroll

new App().write({fit: true});

any other attempt diferent than this doesn't work(it doesn't scroll) at all.

Any ideas?

Thank you in advance!

JB

Comments

  • Don't use the .write() form... try new App.renderInto(document.body) instead.
  • Thank you @unwiredben, that worked to but I still have the problem where scrolling will also scroll the entire screen, here is my code:

    App.js
    
    enyo.kind({
    	name: "App",
    	fit: false,
    	components:[
    		{name: "scroller", classes: "touch"}
    	],
    	rendered: function () {
    		this.inherited(arguments);
    		var items = [];
    		for (var i = 0; i < 80; i++) {
    			items.push({ 
    				content: "HELLO, ITEM " + i,
    				classes: "item"
    			});
    		}
    		this.$.scroller.createComponents(items);
    		this.$.scroller.render();		
    	}
    });
    
    App.css
    
    .touch {
    	border: 20px solid #666;
    	width: 250px;
      	height: 300px;
    	overflow-y: scroll;
      	-webkit-overflow-scrolling: touch;
    }
    
    .item {
    	height: 35px;
    	border-bottom: 1px solid red;
    	width: 100%;
    }
    
    debug.html I have this code:
    
    var app = new App().renderInto(document.body);
    
    Any work around to this issue?

    Thanks again!

    JB
Sign In or Register to comment.