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 an option to use custom class for zoomed image #152

Open
kfeng0806 opened this issue Apr 2, 2020 · 4 comments
Open

Add an option to use custom class for zoomed image #152

kfeng0806 opened this issue Apr 2, 2020 · 4 comments

Comments

@kfeng0806
Copy link

The problem

I'd like to add custom style to the zoomed image, is there possible to add an option for zoom image.

For example:

mediumZoom('[data-zoomable]', {
  class: ['class1', 'class2', 'class3']
})

The result will be:
<img src="image.jpg" data-zoom-src="image.jpg" class="medium-zoom-image medium-zoom-image--opened class1 class2 class3">

@francoischalifour
Copy link
Owner

Can't you add styles to .medium-zoom-image--opened?

@kfeng0806
Copy link
Author

kfeng0806 commented Apr 3, 2020

Sometimes you only wish add the style in some scenes
e.g.: I have user avatar on the page it has rounded border, so i'd like the zoomed avatar image also has consistent style but except other images.

@kerns
Copy link

kerns commented May 27, 2020

This seems like it could be particularly useful in projects where functional css /e.g. tailwind/ are in use.

@ImTheDeveloper
Copy link

Can't you add styles to .medium-zoom-image--opened?

Yea - this is what I've done and seemed to work fine

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

No branches or pull requests

4 participants