1. #1
    Sencha User
    Join Date
    Mar 2011
    Posts
    83
    Vote Rating
    11
    Answers
    16
    Schildi will become famous soon enough

      0  

    Default Unanswered: Scroll to specific component/anchor?

    Unanswered: Scroll to specific component/anchor?


    Hi guys,

    I know that there's the method
    Code:
    Ext.scroll.Scroller.scrollTo(x, y);
    but is it also possible to scroll to a specific component?

    It would be perfect for me if you could do something like the standard anchor-functionality in HTML (with
    Code:
    <a name="top"></a>
        <div>A lot of content.</div>
    <a href="#top">scroll to top</a>
    Let's say I have a view with items:
    Code:
    ...
    items: [
        {
            xtype: 'panel',
            html: '<a name="myAnchor1"></a>'
        },
        {
            xtype: 'panel',
            html: 'A lot of content'
        },
        {
            xtype: 'panel',
            html: '<a name="myAnchor2"></a>'
        },
        {
            xtype: 'panel',
            html: 'Even more content'
        }
    ]
    How could I arrange to scroll (animated) to a specific anchor? Is it possible? Do you have any ideas or workarounds? :-)

    Best regards,
    Schildi

  2. #2
    Sencha User
    Join Date
    Apr 2010
    Location
    China
    Posts
    227
    Vote Rating
    20
    Answers
    64
    haduki will become famous soon enough haduki will become famous soon enough

      0  

    Default


    Code:
    {
       config:{},
       scrollToItem: function(item){
          var me=this,
              scrollX,
              scrollY,
              scrollable=me.getScrollable();
          if(!scrollable){
             return;
          }
          if(typeof item=='number'||typeof item=='string'){
             item = me.getItems().items.get(item));
          }
          if(items){
             scrollX=item.element.getX()-me.element.getX();
             scrollY=item.element.getY()-me.element.getY();
             scrollable.getScroller().scrollTo(scrollX,scrollY/* anime config */);//see doc
          }
       }
    }

Thread Participants: 1