Pushy Panes 2.0 Background Problem

Discussion in 'Pushy Panes' started by Dennis3001, Sep 11, 2017.

  1. Dennis3001

    Dennis3001 New Member

    2
    0
    Hello,
    I have a question about the widget Pushy Panes 2.0, because I don´t find a Solution for my problem after a long time.
    I would like to create a menü like the "EXAMPLE 2" in the Pushy Panes Live Review.
    Unfortunately, I have a problem with the background image.
    I would like, that the image „slides“ behind the Buttons and the fonts if I reduce the browser size. (like Example2).
    Only replace the color with a backgrund-image in the pane area does not bring the effect.
    Can you tell me what I must do?
    And another last short question.
    Is it still possible to position the buttons in the Pane differently at different breakpoints?
    Thank you very much and best regards.
    Dennis
     
  2. DjHerold

    DjHerold Moderator Staff Member Advisory Group

    2,740
    209
    Dennis, the Image of the girl with the brownish background is done by placing it as a Background fill.
    If this isn't what you asking, could you possibly share a screen shot of the area you're speaking of?
    Not sure about your second question, but the Open and Close buttons are percentage based, so they can remain constant across all break points.
    Dj
     
  3. Dennis3001

    Dennis3001 New Member

    2
    0
    Thank you very much for your answer.
    If I fill the background from the object with the graphicstyle „ pane“ with an image, I don´t get the same effect.
    Because if I make the browser smaller, the image in the background dont move behind the buttons.
    I share two screenshots. The first ist the fullscreen background image. So it is ok.
    At the second shot, I make the window smaller and you see, that the background image where „cut“ and the 4 Buttons where push left out of the window.
    The effect that I want is like the Pushy Panes Example 2. If I make the browser smaller, the image moves complete left behind the buttons.
    What can I do? I hope I could explain it, because my englisch is not perfect. Sorry.
    Dennis
     

    Attached Files:

  4. Jeremei

    Jeremei Well-Known Member

    706
    92
    Dennis!
    If you want to get Example 2 effect so I assume that MT-team has made in this way:
    1) Place the image e.g. to 960 breakpoint (image width 960 px)
    2) "Resize" feature - set it to "Responsive with width and height"
    3) Turn chevron-icon to the right in breakpoint panel
    4)
    Drag to canvas "Pushy Panes 2.0" widget (it can be outside the canvas)
    5) "Pushy Panes 2.0 settings" - "Pane Transition Style" set it "Cover Content"
    6) "Pushy Pane 2.0 settings" - "Pane Transition Direction" set it "From Left"
    7) Other settings you can set as you want
    8) If you want to add text with the text tool onto the image so check that the text layer will be on top of the image layer in the layers panel.
     
  5. DjHerold

    DjHerold Moderator Staff Member Advisory Group

    2,740
    209
    Dennis, I believe you may have mis understood my explanation, I apologize for that.
    This particular effect was done similar to the old Versa slide widget, where the 'Pane' was actually another page.
    Take a look at the Video tutorial on the new widget, https://www.muse-themes.com/products/pushy-panes
    At about the 7:30 mark, Ashton describes this feature.
    This is what you need to do, first, the way this was set up is a bit different than we used to allow. On the page that has the Open Button (see Capture2) you will place your widget. Note, you do not need the panel, or open button (unless you want something custom) for this usage.
    All you need to do is make your settings and be sure to use the areas I showed. The URL of the page you are linking to will be whatever you name the new page (in this case it was 'Internal-menu and you then just add .html.
    Now you will need to create a page (named whatever you like , just make sure the link and the page name are the same).
    On screenshot 'Capture', you will see the Background as we have it in the demo. Note, you will place your image using the Background Fill option in Muse.
    I'm assuming you placed an Image in the widgets 'Pane' area and for this effect it doesn't apply.
    Hope this helps, and if you need anything more, please let me know.
    Dj
    Capture2.JPG Capture.JPG
     

Share This Page