Solved Two images in one slide??

Discussion in 'Dynamic Slide' started by cosmopolitan, Apr 9, 2016.

  1. cosmopolitan

    cosmopolitan Member

    5
    0
    Hey guys,

    Your site has been one of the best resources for Muse for me so far. I have a question about the slideshow. I am building a site that sells books. The homepage looks similar to this:

    http://www.foxmovies.com/

    I am trying to have the 100% width slideshow image behind a corresponding book that is in the foreground. Something like this:

    [​IMG]

    The image of the book is to the right replacing the gold buttons in the fox site. I have captions for the book to the left in the slideshow similar to the fox site. I have five slides and five books. I need the image of the books to change with the corresponding slide behind them.

    I tried to follow the instructions on this site to change the image by going into the layers and replacing the image of 'rock' but when doing so, I cannot create another text caption that changes with the slideshow. I then stacked two sliders on top of one another; One slider for the background image and another slider for the foreground book image. This works until someone clicks on a trigger image below the slider then the sync between the two sliders stops. My only other option is to combine the images and save them in photoshop but then I am afraid that the foreground book will not align properly with the state buttons I have under the book image due to different resolution and desktop screen sizes. Can this be done? Thanks in advance.
     
  2. cosmopolitan

    cosmopolitan Member

    5
    0
  3. DjHerold

    DjHerold Moderator Staff Member Advisory Group

    3,459
    255
    Cos, Sorry for the delay, I missed this post somehow.
    I'm not sure what you're describing?
    I can see placing two slideshows over each other, that is how the Advanced version on the widget page works. But what I'm not getting is what you are describing with the "This works until someone clicks on a trigger image below the slider then the sync between the two sliders stops" . I see this in the example site but that's an entirely different slider. That set up could be done with a Composition widget, but Muse doesn't allow for full width compositions yet.
    I need to ask how you've designed the page (maybe a screen shot) because the Dynamic Slider is a full screen slider as a default. And has no "triggers". I'm missing something in your layout, so could you describe a bit more what you've done.
    Dj
     
  4. cosmopolitan

    cosmopolitan Member

    5
    0
    Dj,

    Thanks for the response. Here is the screenshot. Sorry for the secrecy but I signed an NDA
    with the client. I do not own the images used. I am attempting to have the book to the right (and the captions to the left) change with the corresponding slider background image. The comments above should make more sense with this screenshot. When I mention "trigger" what I mean is that when I place two sliders above each other (1. the background slider image (the earth) 2. the book) when someone clicks one the 5 images in the row below (the trigger- i'm new to Muse - probably wrong use of the word) , the sync between the background image and the book image is broken. Each background image should correspond to the proper foreground book image and caption and should change accordingly. When one clicks on one of the five images below I would like to have:
    1. the captions to the left to change
    2. the book image to change
    3. the background image to change : all three in unison

    Is this possible? If so, how?


    Thanks in advance.

    Mockup 1.png
     
  5. DjHerold

    DjHerold Moderator Staff Member Advisory Group

    3,459
    255
    Cosmopolitan, this is what I would suggest to get the effect you're looking for.
    First, instead of the Dynamic slider, I would suggest the "Span Slider'. It allows for full width, and actually looks almost exactly like your attachment. Target image (large) and the Thumbnails acting as Triggers to advance the slides.
    Here's the trick I use, see if this works for you.
    If you look through the parts of the slider, you'll see that there is a "caption' box. You can stretch the caption box to cover some of the target image (large image). If you notice, the caption box acts almost the same as a text box, that means you can place things inside the caption box other than just text.
    In the attachment image I used for a test, you can see I placed a PNG image, some text, and a state button inside the caption box. All these items advance with the large image, either through auto advance or through manual clicking.
    The key is to get the text cursor where you want you item to appear i the caption box and then cut>paste your item at the cursor location.
    It takes some playing around, but it workable.
    Hope this helps
    Dj


    Capture8.JPG
     
    cosmopolitan likes this.
  6. cosmopolitan

    cosmopolitan Member

    5
    0
    Dj,

    Thanks. I will give it a go.
     
  7. cosmopolitan

    cosmopolitan Member

    5
    0
    Dj,

    That did the trick.

    Thanks
     

Share This Page