Background image causes visual jitter when scrolling

[quiddity-wp]

The background image (diagonal stripes) at https://weekly.hatnote.com/ and subpages, causes intense visual "jitter" when I scroll.

Suggest: changing or removing the background image.

[mahmoud]

Interesting, curious what Stephen'll make of it. In the meantime, I'm thinking of a workaround, but I'm unable to reproduce on Firefox, I get a little bit of flicker on Chrome maybe. Would you mind sharing what browser are you using and zoom level are you at?

[quiddity-wp]

You're fast! And sure thing! Tested on:

• Firefox (latest), and Chromium (latest) on Mint Linux,
• normal zoom,
• a desktop-monitor and laptop-screen.

Here's a screen-recording from the laptop: out-4.ogv.tar.gz

It's just distracting. I get the same distracting flicker when trying to scroll any page/image that consists of tight diagonal stripes. E.g. Zoom in 200% on this image and scroll to magnify the effects.

[mahmoud]

Interesting, that screen capture video looks fine on my Ubuntu 16 laptop. As a longtime Linux-on-the-desktop user, I think I know what you're talking about. I bet a video taken with your phone at high framerate would show it. Maybe a v-sync or refresh rate issue? Now I'm just curious, what version of mint on what display? And I guess maybe display chipset? (I'm guessing intel)

[slaporte]

I don't see it either, but I've been worried about the moiré-looking effect.

Do you see the same thing with more spaced out stripes? I'm wondering if we can stick with this diagonal stripe style, or we'll need to come up something new.

[quiddity-wp]

Moire effect!! That's the term I was trying to remember!

Yeah, i find it distracting on any size diagonal stripes.

I've tried playing around a bit with this: http://www.stripegenerator.com/ (click the tiny red-text "open fullscreen preview") to test.

I'll not share details about my configuration, just so that we don't tangent away from the abstract problem into resolving it for only me! ;D

[slaporte]

Hey @quiddity-wp how does this look? https://weekly.hatnote.com/

We're working on a few Weeklypedia updates on the backend, so we might as well refresh the design at the same time.

[quiddity-wp]

Solved! LGTM.

[mahmoud]

Great! Thanks :)