Highlighted

Game screenshots in Lightbox Slideshow

Community Beginner ,
May 09, 2018

Copy link to clipboard

Copied

Hi!

I'm currently working on a webpage for a game and I have screenshot thumbnails that you should be able to click and a lightbox slideshow should appear with a bigger screenshot. I would like it to work as the screenshots on King's website (https://king.com/game/candycrush​​). When viewed on mobile devices the whole screenshot is shown when clicked, be it in landscape or portrait mode. How should I proceed?

I've been fiddling with the Lightbox Slideshow widget, but the images seem to get cropped and I have to scroll down to see the rest of it.The Fullscreen Slideshow seem to do what I want in terms of scaling and fitting the screen, but it can't be closed and does not have a lightbox element.

Best,

Sven

Community Beginner
Correct answer by sirqus | Community Beginner

Hi Günter!

I think you missunderstood, I wanted the Target (or Hero Image) to fit the whole screen and scale to still fit the screen when the browser changed size (exactly as King does it). I had not gotten to fiddling with the triggers yet, it was a secondary problem.

Anyway, I found this widget: Muse For You Shop | Adobe Muse CC | Responsive Lightbox Gallery Widget that does almost everything I want. Trying to figure out the standard widgets took too long, so I had to buy it.

But thank you regardless!

Best,

Sven

Views

164

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Game screenshots in Lightbox Slideshow

Community Beginner ,
May 09, 2018

Copy link to clipboard

Copied

Hi!

I'm currently working on a webpage for a game and I have screenshot thumbnails that you should be able to click and a lightbox slideshow should appear with a bigger screenshot. I would like it to work as the screenshots on King's website (https://king.com/game/candycrush​​). When viewed on mobile devices the whole screenshot is shown when clicked, be it in landscape or portrait mode. How should I proceed?

I've been fiddling with the Lightbox Slideshow widget, but the images seem to get cropped and I have to scroll down to see the rest of it.The Fullscreen Slideshow seem to do what I want in terms of scaling and fitting the screen, but it can't be closed and does not have a lightbox element.

Best,

Sven

Community Beginner
Correct answer by sirqus | Community Beginner

Hi Günter!

I think you missunderstood, I wanted the Target (or Hero Image) to fit the whole screen and scale to still fit the screen when the browser changed size (exactly as King does it). I had not gotten to fiddling with the triggers yet, it was a secondary problem.

Anyway, I found this widget: Muse For You Shop | Adobe Muse CC | Responsive Lightbox Gallery Widget that does almost everything I want. Trying to figure out the standard widgets took too long, so I had to buy it.

But thank you regardless!

Best,

Sven

Views

165

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
May 09, 2018 0
LEGEND ,
May 09, 2018

Copy link to clipboard

Copied

This is a simple task for a standard "Composition Lightbox“ widget:

  • Place the widget.
  • Resize the triggers and place the thumbnails into it (or „fill“ the triggers with the thumbnails).
  • Place the screenshot into the target area.
  • Customise the whole composition as you like.
  • The target screenshot will automatically adapt the size of different screens.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
May 09, 2018 0
Community Beginner ,
May 09, 2018

Copy link to clipboard

Copied

Hi Günter! Thank you for the quick reply.

It does not seem to work either. The Target of the composition seem to not be able to have responsive width AND height. When changing the height of the window the image does not scale, and when hitting the edge of the image it starts to crop (and a scrollbar appears). When the window width gets smaller only then does the image scale down.

If you look at the screenshots on King's site and resize the browser, the image sticks to the edges (top and bottom OR left and right) of the screen (up to a point where it starts adding padding instead). I'd like to reproduce something like that in Muse, but perhaps it's not possible with the standard widgets?

Best,

Sven

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
May 09, 2018 0
LEGEND ,
May 09, 2018

Copy link to clipboard

Copied

Muse’s triggers react in a very sophisticated way: If you make the image exactly as large as the trigger, the triggers will scale proportionally. If this is not possible, because you want to place text or something else too, use a transparent image frame of exact the size of the trigger, and place the other elements onto it. In your use case, don’t fill the triggers with an image, but place into into it. Look here:

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
May 09, 2018 0
Community Beginner ,
May 14, 2018

Copy link to clipboard

Copied

Hi Günter!

I think you missunderstood, I wanted the Target (or Hero Image) to fit the whole screen and scale to still fit the screen when the browser changed size (exactly as King does it). I had not gotten to fiddling with the triggers yet, it was a secondary problem.

Anyway, I found this widget: Muse For You Shop | Adobe Muse CC | Responsive Lightbox Gallery Widget that does almost everything I want. Trying to figure out the standard widgets took too long, so I had to buy it.

But thank you regardless!

Best,

Sven

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
May 14, 2018 0
LEGEND ,
May 14, 2018

Copy link to clipboard

Copied

No, I didn’t understand. You only use a lghtbox compositiuon instead and configure the lightbox acordingly!

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
May 14, 2018 0