Skip to content
This repository has been archived by the owner on Feb 6, 2022. It is now read-only.

Remove overflow: hidden from .libjass-wrapper #74

Open
Arnavion opened this issue Apr 6, 2016 · 5 comments
Open

Remove overflow: hidden from .libjass-wrapper #74

Arnavion opened this issue Apr 6, 2016 · 5 comments

Comments

@Arnavion
Copy link
Owner

Arnavion commented Apr 6, 2016

It prevents scrollbars if the video is larger than the viewport.

It exists to hide the .libjass-font-measure divs when they're being used. Need to find another way to hide them, or atleast remove the overflow: hidden when they're not being used.

@XCanG
Copy link

XCanG commented Apr 6, 2016

@Arnavion did you try this CSS rule?:
clip: rect(Y1, X1, Y2, X2) | auto | inherit
also analogs:
clip-path: url(#clipping); link to svg file with mask (may be placed in same document at the end)

<svg>
  <defs>
    <clipPath id="clipping">
      <rect x="X1" y="Y1" width="W" height="H"/>
    </clipPath>
  </defs>
</svg>

clip-path: polygon(0px 0px, X 0px, X Y, 0px Y); or directly

mask-image: url(mask.svg); or again link to svg where black is opaque and white is transparent,
mask: url(mask.svg) top left / cover; will adjust size to element

-webkit-mask-box-image: url("border.svg") 100 repeat;
  mask-border: url("border.svg") 100 repeat;

another way to masking border content

More info here:
https://developer.mozilla.org/en-US/docs/Web/CSS/clip
https://developer.mozilla.org/en-US/docs/Web/CSS/clip-path
https://developer.mozilla.org/en-US/docs/Web/SVG/Element/rect
https://developer.mozilla.org/en-US/docs/Web/CSS/mask
http://www.html5rocks.com/en/tutorials/masking/adobe/
http://codepen.io/yoksel/full/fsdbu/
https://www.w3.org/TR/css-masking/

@Arnavion
Copy link
Owner Author

Arnavion commented Apr 6, 2016

Yes, clip is also what I was thinking of.

@Arnavion
Copy link
Owner Author

Arnavion commented Apr 6, 2016

Right, now I remember. clips don't work because they affect visibility, not layout, so they don't solve the problem that overflow: hidden currently solves (that the font-measure divs don't affect layout of the rest of the page).

@XCanG
Copy link

XCanG commented Apr 7, 2016

Hm, how about rendering on canvas?

@Arnavion
Copy link
Owner Author

Arnavion commented Apr 7, 2016

#13 especially the third comment

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants