Scrolling in Processing.js programs; prevent default and do what you please

28 views
Skip to first unread message

Hunter R. Shaw

unread,
Jul 8, 2021, 11:11:08 PM7/8/21
to Khan Academy Javascript Technical Q&A
Up until a bit over a year ago, the following code snippet worked to 
a) prevent scrolling in the main page when the cursor was over the canvas 
and
b) store data about scrolling in a variable so you can do with it whatever you like

var window = (function(what) {return this[what];})("window");
var canvas = window.Processing.instances[0].externals.canvas;
canvas.onwheel = function(event){
    event.preventDefault();
    scroll -= event.deltaY;
};

It no longer works. Not only that, but it stops any program with that code in it from loading. I would like to see any currently working methods of doing what I described above.

I'm not a very advanced user, so a lot of these code snippets with strange syntax I wouldn't ordinarily write into a program confuse me. If any of you could advise on how to create these (without just finding them and bending them to my needs), that would be very welcome.

Thanks,
Hunter

Inger Hohler

unread,
Jul 28, 2021, 3:57:41 PM7/28/21
to Khan Academy Javascript Technical Q&A
I'm no HTML/CSS/JS specialist either, but I'm wondering what you need this code for. 
This program does not use any special code for the side scroller, https://www.khanacademy.org/computer-programming/accessibility-exercises/5906841548898304
It can be navigated with a mouse or with arrows, and it does not scroll by itself when the cursor is over the canvas. There is a skip link and you can tab through the text parts.

Do you have a link to the non-working program?
Reply all
Reply to author
Forward
0 new messages