Animated gifs: Make it stop!

Feature
27

This is now done and merged, animated images won’t be lightboxed. The example above has been updated (existing posts need a rebake for this to take effect).

Will backport shortly.

8 Likes
28

This topic was automatically closed after 4 days. New replies are no longer allowed.

29

This is a fun one, it’s impossible to play a de-spoilered gif:

american psycho glitch GIF by u̶͛͗̽ n̵͇ͨ g̵̼͂ l̵᷅ t̵̄ c̵̃͘ h̵͚ m̵͇͑e͔

7 Likes
32

Not completely related, but I’ve seen similar issues with spoilered images, where all you want to do is reveal the image and it actually pops up the full size image at the same time. Not related to the gif issue of course, but wanted to mention since it still has to do with clicking images that are behind spoiler tags.

2 Likes
33

Fun indeed! One way to fix this would be to disable lightboxes and pausing animated images inside the spoiler element. It’s very easy to do this with just CSS:

.spoiled {
  img.animated,
  .lightbox {
    pointer-events: none;
  }
}

We could also have lightboxing and pausing animations apply only when the contents is unblurred, but that can’t work with the spoiler being a toggle. But if we decide to switch the spoiler behaviour to be one way (unblur on click and that’s it), this could work too.

4 Likes
34

I’d really recommend not doing that. Personally, I find the toggle really important for reviewing my posts (both in the preview and after posting) to make sure I blurred everything appropriately. If it was one way only, once I unblur the text to actually review for typos I’d have no choice but to refresh the page to double check the blur locations. And often I do this multiple times (as I make edits), so having to refresh every time would be really inconvenient.

That said, if you’re just talking about making image unblurring one way, that’s probably not a big deal. (I posted my reply before rereading your post, so I think I missed some context, but it can’t hurt to emphasize the usefulness of the toggle in general, even if it’s not terribly important for images.)

3 Likes
35

@cvx implemented a fix for the spoiler elements, the blurring is one-way for elements that have their own click actions (lightboxes, animated gifs, links, videos, inputs, etc.). See this commit for more details.

In the preview, spoilers are toggleable. In posts, there is a bit of a workaround where you can click in the space next to an image to reblur it. You can try this out in the animated image posted by Kris above.

9 Likes
38

Doesn’t work on my iPhone 8 when the screen is vertical since there is no space next to the image, but I don’t really see a good way around that. Seems like a reasonable solution overall.

4 Likes
39

This is such a wonderful feature, thanks @pmusaraj :conf

5 Likes