Highlighted

How can i fix the Target (without the Trigger) in my composition ?

New Here ,
Feb 22, 2018

Copy link to clipboard

Copied

Hello everyone !

So here's the thing, I've been learning how to use Muse for a couple of days now, and i'm trying to understand how to do something from the main design i did in photoshop.

The idea is to have a list of my projects (just the names) that I can scroll in, and the rollover on the text shows a huge image of the project behind the list, which is fixed while I scroll the project names.

I've been looking around, and found out that I could use the composition widget to get that effect, using text as a Trigger, and the Targets as the Pictures,

but I can't figure out how to fix the Targets and not the Triggers, they seem to be linked in the widget and can't be fixed separately.

If by any chance you'd have any idea how to get the Pictures/Targets to be fixed and the Text/Triggers the keep scrolling

I'm sorry if my explanation is a bit sketchy, but I hope you could help me, or if you'd have any solutions other than the composition widget

Thanks a lot

Aleksey/

Ok, let us look for a „logical“ approach:

  • You want full screen images. The only widget, which actually works full screen is the „Full Screen Slideshow“. So let’s try this one.
  • Place a Full Screen Slideshow, deselect all control element and activate „Thumbnails“.
  • Now set the thumbnails to „Resize: None“. (Resize: In width and height will cause glitches in the following approach)
  • The problem: The thumbs contain the minimised hero image, and we want text.
  • So select one of these images within its thumbnail. (Select slideshow -> thumbnail container -> thumbnail -> image)
  • Now right click onto the image and choose „Select same (image)"
  • Drag the image out of the visible thumbnail area.
  • Select the thumbnail (not the image, not thumbnail container) and give it an appropriate colour.
  • Uncheck „Edit together“ in the slide show options.
  • Use the „Fill“ command to assign a text image to every thumbnail. (You definitely need the text as an image, because „real“ text can’t be integrated into the thumbnail. Of course you can use different images per state, if needed.

The result are „buttons“, which switch the full screen images behind them – and that is, what you were looking for. I am sure, that there is no other possibility to achieve, what you want, with Muse’s tools „out of the box“.

Here a quick and dirty screencast to illustrate this workflow:

Views

338

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

How can i fix the Target (without the Trigger) in my composition ?

New Here ,
Feb 22, 2018

Copy link to clipboard

Copied

Hello everyone !

So here's the thing, I've been learning how to use Muse for a couple of days now, and i'm trying to understand how to do something from the main design i did in photoshop.

The idea is to have a list of my projects (just the names) that I can scroll in, and the rollover on the text shows a huge image of the project behind the list, which is fixed while I scroll the project names.

I've been looking around, and found out that I could use the composition widget to get that effect, using text as a Trigger, and the Targets as the Pictures,

but I can't figure out how to fix the Targets and not the Triggers, they seem to be linked in the widget and can't be fixed separately.

If by any chance you'd have any idea how to get the Pictures/Targets to be fixed and the Text/Triggers the keep scrolling

I'm sorry if my explanation is a bit sketchy, but I hope you could help me, or if you'd have any solutions other than the composition widget

Thanks a lot

Aleksey/

Ok, let us look for a „logical“ approach:

  • You want full screen images. The only widget, which actually works full screen is the „Full Screen Slideshow“. So let’s try this one.
  • Place a Full Screen Slideshow, deselect all control element and activate „Thumbnails“.
  • Now set the thumbnails to „Resize: None“. (Resize: In width and height will cause glitches in the following approach)
  • The problem: The thumbs contain the minimised hero image, and we want text.
  • So select one of these images within its thumbnail. (Select slideshow -> thumbnail container -> thumbnail -> image)
  • Now right click onto the image and choose „Select same (image)"
  • Drag the image out of the visible thumbnail area.
  • Select the thumbnail (not the image, not thumbnail container) and give it an appropriate colour.
  • Uncheck „Edit together“ in the slide show options.
  • Use the „Fill“ command to assign a text image to every thumbnail. (You definitely need the text as an image, because „real“ text can’t be integrated into the thumbnail. Of course you can use different images per state, if needed.

The result are „buttons“, which switch the full screen images behind them – and that is, what you were looking for. I am sure, that there is no other possibility to achieve, what you want, with Muse’s tools „out of the box“.

Here a quick and dirty screencast to illustrate this workflow:

Views

339

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
Feb 22, 2018 0
Feb 22, 2018

Copy link to clipboard

Copied

Hey Aleksey,

I think you should give a try to Tooltip widget - How to add a Tooltip |

However, this design would definitely require a lot of customization.

You can either customize it yourself or also choose a third party widget for according to your requirement -  https://musewidgets.com/search?q=tooltip.

Hope this helps!

Regards,

Ankush

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...
Feb 22, 2018 0
New Here ,
Feb 23, 2018

Copy link to clipboard

Copied

Hello Ankush !

Thank you for the tip, I tried to use the tooltip composition widget, using the lightbox preset.

So now the image is fixed, which is a good thing, but it gets in front of the Triggers and you have to click on the trigger to show the images.
Which is a problem because I wanted to show the picture on the trigger's rollover and it seems that the lightbox won't allow rollovers.

The other options allow me to rollover the triggers, but the image won't stay fixed like on the lightbox

I'll try to figure out something, but the main problem is fixing the photos in the back of the triggers, so it won't move while i'm scrolling the triggers.

Here's a picture explaining what I'm trying to do, if by any chance it could help understand the issue.Sans titre-1.jpg

Thank you so much for the help.

Aleksey/

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...
Feb 23, 2018 0
LEGEND ,
Feb 23, 2018

Copy link to clipboard

Copied

Could you please re-pfrase your intention in clear, simple words. I don’t understand, what you are trying to achieve.Your images don’t make it clearer (for me).

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...
Feb 23, 2018 0
New Here ,
Feb 23, 2018

Copy link to clipboard

Copied

I want a list of projects (triggers in the image) that i can scroll in, and every time i roll over on the name of a project, the image related to the project would show in the background.

I hope it's easier to understand

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...
Feb 23, 2018 0
LEGEND ,
Feb 23, 2018

Copy link to clipboard

Copied

Aleksey-  schrieb

I want a list of projects (triggers in the image) that i can scroll in, and every time i roll over on the name of a project, the image related to the project would show in the background.

I hope it's easier to understand

That is so clear to understand, that I fear, this is not the whole story.

You can use a composition, place images into the targets and configure the composition as „Show Target on Rollover“ and „Triggers on Top".

You may run into one „issue“ (what in fact is no „issue“, but a feature: If the image fills most of the target, the target scales in width and height (= proportionally, just like then image does). But actually, triggers, which overlap/are placed „in" the target, don’t move synchronously with the target (see my screencast). This is the case in slide shows as well.

Solution: Don’t place the image, but fill the target. (= composition to the right in my screencast.)

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...
Feb 23, 2018 2
New Here ,
Feb 23, 2018

Copy link to clipboard

Copied

Thank you Günter, this is solving the problem of overlaping pictures.

But this isn't as simple as it seems, the thing I'm trying to do is : for exemple if I have 20 triggers, that can't all be shown in the page,

I'd like to make the picture in the BG become full page so I could keep scrolling through the triggers and still see the picture in the BG.

I know that it seems strange but i'll keep trying

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...
Feb 23, 2018 0
LEGEND ,
Feb 23, 2018

Copy link to clipboard

Copied

Ok, let us look for a „logical“ approach:

  • You want full screen images. The only widget, which actually works full screen is the „Full Screen Slideshow“. So let’s try this one.
  • Place a Full Screen Slideshow, deselect all control element and activate „Thumbnails“.
  • Now set the thumbnails to „Resize: None“. (Resize: In width and height will cause glitches in the following approach)
  • The problem: The thumbs contain the minimised hero image, and we want text.
  • So select one of these images within its thumbnail. (Select slideshow -> thumbnail container -> thumbnail -> image)
  • Now right click onto the image and choose „Select same (image)"
  • Drag the image out of the visible thumbnail area.
  • Select the thumbnail (not the image, not thumbnail container) and give it an appropriate colour.
  • Uncheck „Edit together“ in the slide show options.
  • Use the „Fill“ command to assign a text image to every thumbnail. (You definitely need the text as an image, because „real“ text can’t be integrated into the thumbnail. Of course you can use different images per state, if needed.

The result are „buttons“, which switch the full screen images behind them – and that is, what you were looking for. I am sure, that there is no other possibility to achieve, what you want, with Muse’s tools „out of the box“.

Here a quick and dirty screencast to illustrate this workflow:

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...
Feb 23, 2018 0