facebook

Scroll to beginning of a panel: Example provided

  1. MobiOne Archive
  2.  > 
  3. Getting Help – General
Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #323418 Reply

    djs84_deleted
    Participant

    Hi,

    i habe a panel which has an height of 1000px.

    is there a possibility to set an ancor to jump to the beginning of the panel or javascript scrolltop() feature?

    <a href=”#top”>top</a> and <a name=”top”></a> doesn’t work 🙁

    thx for help

    #323455 Reply

    djs84_deleted
    Participant

    no one an idea?

    #323473 Reply

    support-michael
    Keymaster

    @djs84

    I will post an example shortly.

    #323474 Reply

    support-michael
    Keymaster

    Here is an example that will only scroll a panel to its top position.

    Note: there is some quirk that I have not figured out yet that prevents this example and the api in use from providing universal panel positioning. So only use it to scroll to the top of a a panel.

    Step-1: create your design with a panel and set its properties as follows
    – enable vertical scrollbar
    – increase the content area height property to a large value so the panel will scroll

    Step-2: generate code and inspect to find the panel’s scrollbar ID
    See attachment scroll-to-top.png
    Step-3: add widget that when selected can fire an On Change – Run JavaScript action, e.g., button or link widget
    – Use the snippet of code shown below with the #m1-GotoTop- id changed to the id you discover when you look it up the generated HTML file

    $('#m1-GotoTop-')[0].myScroll.scrollTo(0,0,"500ms")

    See attachment scroll-to-top-1.png

    Step-4: save file and run in Test Center or on your device

    Here is the .mobi design file used in this example. The button that initiates scrolling is at the bottom of the panel and offscreen. You can scroll the panel in the designer by selecting it and then hover your mouse over the right side scroller that appears. Then click and drag the scroller when it highlights as you fly over it.

    Open it in the Design Center and click the Run in Test Center action.
    See attachment GotoTop.mobi

    Attachments:
    You must be logged in to view attached files.
    #323475 Reply

    djs84_deleted
    Participant

    you’re great.

    thx man 🙂

    #323541 Reply

    djs84_deleted
    Participant

    it Works Great in an iPhone but do you have a solution for android mobile Phones?

    this Exempel at the Top doesnt work on android

    #323545 Reply

    support-michael
    Keymaster

    @djs84

    That will be coming soon when we roll out android support next month.

    #323682 Reply

    djs84_deleted
    Participant

    @wayne

    if you have a small javscript code for android or another solution…you will make me very happy 😉

    #323683 Reply

    support-michael
    Keymaster

    @djs84

    >if you have a small javscript code for android or another solution

    We will not officially have android support for a few more weeks. In the meantime I’ll see if I can get something working.

    #323718 Reply

    djs84_deleted
    Participant

    ok…thx a lot

    #324583 Reply

    Maloni
    Participant

    @wayne,

    $(‘#m1-GotoTop-‘)[0].myScroll.scrollTo(0,0,”500ms”) in MobiOne Version 1.5 no function.
    Got a tip?

    thx for help

    #324600 Reply

    Maloni
    Participant

    Has done it!
    In Version 1.5 is changes the id of the panel’s internal scrollers.
    Previously in MobiOne 1.4.3: $ (‘#m1-GotoTop-‘) [0] myScroll.scrollTo (0,0, “500ms”)
    Now in MobiOne 1.5: $ (‘#m1-GotoTop-panel1-scroller’) [0] myScroll.scrollTo (0,0, “500ms”)

    That’s all 😉

Viewing 12 posts - 1 through 12 (of 12 total)
Reply To: Scroll to beginning of a panel: Example provided

You must be logged in to post in the forum log in