[go: nahoru, domu]

Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add a background opacity in the subtitles #612

Closed
x3inspire opened this issue Sep 1, 2023 · 11 comments
Closed

Add a background opacity in the subtitles #612

x3inspire opened this issue Sep 1, 2023 · 11 comments

Comments

@x3inspire
Copy link

Hi,

Can add a background opacity in the subtitles setting? It can help with seeing the subtitles more clearly without using too much focus.

@zhw2590582
Copy link
Owner

You can add additional styles:

.art-subtitle p {
  background: rgb(0 0 0 / 50%);
}

@x3inspire
Copy link
Author

Hi, seem like the background dispplay following the full size of player.

image

Possible background just focus following the subtitle area?

@zhw2590582
Copy link
Owner

What is your artplayer version?

@x3inspire
Copy link
Author

What is your artplayer version?

5.0.9

@zhw2590582
Copy link
Owner

@x3inspire
Copy link
Author

My test here is fine.

https://codesandbox.io/s/eager-glade-5n5r43?file=/src/index.mjs

Could you check my code, is there something wrong?
image

@zhw2590582
Copy link
Owner

This applying the style to the subtitle container, not the subtitle row. This is different.

@x3inspire
Copy link
Author
x3inspire commented Sep 30, 2023

This applying the style to the subtitle container, not the subtitle row. This is different.

This is my full code, may i know where should i put those code?

https://pastebin.com/hW9tcrLq

@zhw2590582
Copy link
Owner

https://codesandbox.io/s/eager-glade-5n5r43?file=/src/index.mjs

Add the style in your own css file

@x3inspire
Copy link
Author

It doesn't work if we put "escape: false"

image

@zhw2590582
Copy link
Owner

Yes, when "escape: false" is set, ".art-subtitle p" will be invalid. At this time, the style of the subtitle line cannot be modified unless your subtitle file has tags:

1
00:00:00,306 --> 00:00:00,844
<p>那一天</p>
<p>あの日</p>

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

No branches or pull requests

2 participants