gadenbuie / xaringanExtra

:ferris_wheel: A playground of enhancements and extensions for xaringan slides.
https://pkg.garrickadenbuie.com/xaringanExtra
Other
448 stars 36 forks source link

freezeframe ignores gif width #103

Closed jhelvy closed 2 years ago

jhelvy commented 3 years ago

I'm finding that when I include xaringanExtra::use_freezeframe(), gifs freeze correctly but the width is ignored. It always resizes to the full gif size. Here's an example:

---
title: "Freezeframe reprex"
date: March 30, 2021
output:
  xaringan::moon_reader:
    lib_dir: libs
    seal: false
    nature:
      ratio: "16:9"
---

```{r setup, include=FALSE}
xaringanExtra::use_freezeframe()

Should be 300px wide, but switches to full size


Full size for comparison

gadenbuie commented 3 years ago

Thanks for being an early adopter @jhelvy! Have you tried calling use_freezeframe() with responsive = FALSE?

jhelvy commented 3 years ago

That's the fix! I wonder if the default should be FALSE rather than TRUE? Not sure how often this will be an issue for folks who resize their images but don't read the documentation carefully enough like I just did :)

gadenbuie commented 3 years ago

I'm on the fence about this one. I think that responsive = FALSE could be a good default; it's essentially what happens when you use plain ![](keyboard-cat.gif) syntax.

On the other hand, images are stretched to 100% width by default so ![](keyboard-cat.png) would have been 100% width. My sense is that most people would prefer gifs were displayed at 100% width and currently have to use work-arounds to get animated images to be the size they want. So that's why I stuck with the freezeframe.js default of responsive = TRUE.

On the other other hand, I'm sure it's just as likely that responsive images will cause problems for some people who will need to figure out how to turn it off or to adjust the image size by putting the gif in a width-constrained container.

In the end I settled on following the freezeframe default, hence responsive = TRUE.

jhelvy commented 3 years ago

I can see it going either way. At least there's this issue now in case someone has the same problem. I'm fine to close this unless you want to leave it open for feedback from other early adopters.

BerriJ commented 3 years ago

While use_freezeframe() works for me when using html syntax:

<center>
<img src="weights_lambda.gif">
</center>

It does not when using markdown:

![](weights_lambda.gif)

I played around with the "selector" argument a little bit but could not get it working. I'm happy for advice on how to debug this.

Im using the sidney theme but nothing really exotic afaik.

gadenbuie commented 3 years ago

@BerriJ The sydney theme does include a zooming plugin for remark that might be interfering with Freezeframe. Can you confirm that you also encounter the problem with the default theme? In either case, would you mind opening a new issue with a small example?

BerriJ commented 3 years ago

@gadenbuie Thank you very much. I just created a reprex and during the strip-down to make it as minimal as possible I discovered that the self_contained option causes the problem. I created an issue for this as you suggested: #115 Thank you very much.

yadav-rohit commented 1 year ago

Hi, I am having the same issue as I was working on one of my react projects with react-freezeframe.js. I am not able to change the size of the gif