TweetDeck can play GIFs for a while now. That's nice. It does, however, automatically start playing them as soon as they are in view. That's less nice, especially if you have multiple columns on a large screen - distraction ensued.
As you may expect, however, this can be fixed with a bit of JavaScript.
The general idea is as following:
-
Every now and then, iterate over not-yet-checked GIF containers.
This is done via querySelectorAll. Using MutationObserver could be a better idea, but dynamically assigning listeners on right elements ins a challenge. - GIFs that are already paused are ignored.
- GIFs in "full tweet" containers" are ignored.
-
Attempt to pause the GIF.
If that succeeds, mark the GIF as "checked" (to not loop over it again).
Otherwise (no pause button / failed to pause), leave it alone till the next check.
This translates straightforwardly into a snippet of code:
setInterval(function() { var nodes = document.querySelectorAll( ".js-media-preview-container.is-gif:not(.cc_yal_tweetdeck_gif_autopause)" ); for (var i = 0; i < nodes.length; i++) { var node = nodes[i]; if (!node.classList.contains("is-manually-paused") && !node.parentElement.classList.contains("detail-preview")) { var pauseButton = node.querySelector(".gif-pause"); if (!pauseButton) continue; pauseButton.click(); if (!node.classList.contains("is-manually-paused")) continue; } node.classList.add("cc_yal_tweetdeck_gif_autopause"); } }, 500);
You could simply paste the above into JavaScript console, or use a userscript extension (GreaseMonkey for Firefox, TamperMonkey for Chrome, etc.) to set it up to run automatically when you load TweetDeck. For convenience, a pre-assembled script is available too.
Have fun!
Update: current versions (>= May 9, 2017) of TweetDeck spot a setting for this in General tab of Settings, so this post is mostly an example of processing TD items, I guess.
Do you know of a way to do this for any website?
Firefox has a global flag image.animation_mode in about:config that you can set to none to disable GIF autoplay everywhere. Other browsers need extensions (aren’t too hard to find). Making a userscript for a specific site depends on whether the site uses actual GIFs or not – for example, Twitter and IMGUR convert images to videos while Tumblr keeps them as actual GIFs.