Search code examples
javascriptcoffeescriptprototypeframerjs

print scroll position in Framer.js

I'm prototyping in Framer.js. I have a scroll component and scroll content, I'm trying to print the current x or scrollX position of the content. So if I scroll 500px to the right the code will print 500

Bg = new BackgroundLayer
backgroundColor: 'FFF'

scroll = new ScrollComponent 
    width: 750
    height: 1334
    scrollVertical: false

layerA = new Layer 
        width: 750 * 5
        height: 1334 
        superLayer: scroll.content

layerA.style.background = "-webkit-linear-gradient(45deg, #2AF 0%, #F00 100%)"

# get current x value of scroll content
print layerA.scrollX

Framer Demo: http://share.framerjs.com/70pi1l6is76t/

Codepen Demo: http://codepen.io/matter/pen/78fc798001529418123b84470ea8c625?editors=0010

Thank you in advance,

Solution

  • You can print the current scrollX value by adding an event listener:

    scroll.onScroll ->
    print scroll.scrollX

    More on events: http://framerjs.com/docs/#events.events

    Updated Framer demo: http://share.framerjs.com/jvmsrtmm7i5g/