Adjusting canvas size for online experiments

Online experiments
1

Description of the problem:
The canvas size (the size of the visual surface in the browser / the size of the page) in my experiment seems to correspond to the full-screen size.
This works great in the full-screen mode. However when I am running the task out of the full-screen mode, this canvas is larger (in both height and width than the browser window), and the browser shows scroll bars.

This is highly undesirable because left and right arrow keys, which participants use to respond, end up shifting the canvas and all the task objects left and right every time they respond.

Is there any way to avoid this? E.g. rather than fixing the canvas size it to 100% of the screen size, taking 90% instead, or setting it to whatever size the browser window is?

URL of experiment: TBDTask [PsychoPy]

3 Likes
2

In case useful to others. I found myself with the same issue.

For me it was fixed by ensuring that all my textboxes were set at a height slightly smaller than 1 height unit (e.g., 0.90 height units).

It seems that the drawing window frame of browsers is slightly smaller than what PsychoJS thinks “fullscreen” is. So, if you present a component at “fullscreen” height or width, then scroll bars will appear. Ensuring that all components are slightly smaller than “fullscreen” height and width will prevent scroll bars from being used.

At least, this worked for me :slight_smile: