Scrolling Speed?

scrolling

(James) #1

Trying to get a really simple parallax effect on a really simple one page design - any way to do this by changing the scrolling speed of specific elements? Any way to create scroll effects by tacking on some javascript/jquery somewhere within hype?


(james koh) #2

You can hit record and then cange the time on timeline and move your element. You can choose drag option and control the timeline. But it might freeze. So what i did was put a box over your element and make that box invisible. Then over the box, select control timeline action. Vertical. Scrolling speed can be managed by changing the lenght of the time.
You can put html widget and do the samething.
I hope this will help.


(James) #3

looks like the drag option might only work on mobile— looking for a way to control scrolling speed of elements on desktop


(james koh) #4

Works fine on desktop too.


(James) #5

to be clear, I’m not looking to actually click and drag the element - when you scroll the page, I’d like the element to scroll faster than the other elements. that doesn’t seem to work using on drag.


(james koh) #6

I see.
I am afraid this one is not correct answer but here is javascript i found.

var thing = $(’#smallBox’);
var extra = 100;
var old = $(thing).scrollTop();
$(thing).scroll(function() {
if ($(thing).scrollTop() < old) {
$(thing).scrollTop($(thing).scrollTop()-extra);
} else if ($(thing).scrollTop() > old) {
$(thing).scrollTop($(thing).scrollTop()+extra);
}
old = $(thing).scrollTop();
hex = ($(thing).scrollTop()%4096).toString(16);
$(thing).css(‘background-color’,’#’+hex);
});