Results 1 to 2 of 2

Thread: How to use scrollable Div

  1. #1
    Sencha User
    Join Date
    Apr 2012
    Vote Rating

    Default How to use scrollable Div

    Hi Guys,

    I am new to sencha touch and am having problem with adding scrollable div. I am currently developing a mapping application for mobile in sencha touch 2.0.1 with open-layers.
    I have different annotations on a map, when the user clicks on an annotation a speech bubble is shown with some text ( Please see attached image) . The content of the speech bubble may very from 50 characters to 1000 characters therefore I want to add a vertically scrollbar if the content is too long.

    How do I do that ? Suppose I have the following div :
    var speechBubble = '<div id="SpeechBubble">bla bla bla</div>'

    Should I use a div or switch to a panel. If I use a panel how do I use it. The following doesn't work :
    var speechBubble = '<div id="SpeechBubble">'+new Ext.Panel({height: 100, scroll: 'vertical', layout: {type: 'fit', align: 'stretch'}, html: _SomeHtml}+'</div>'

    Please note that the app will be a native app and will wrapped with phonegap 2.5.



  2. #2
    Sencha User mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Gainesville, FL
    Vote Rating


    Sencha Touch uses it's own scroller not the device's so if a <div> is scrollable it won't scroll as you would expect. You would need to use a container and make it scrollable.
    Mitchell Simoens @LikelyMitch
    Modus Create, Senior Frontend Engineer
    Need any sort of Ext JS help? Modus Create is here to help!

    Check out my GitHub:

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts