Okay
  Public Ticket #1760374
popup opens under other layer, z-index does not apply
Closed

Comments

  • michele started the conversation

    Hi, I've been learning to work with layerslider for a month now. Out of enthusiasm I started building up my website  based on Your LayerSlider only-:

    As my Main-Page one Slider is placed on the empty black background of a flatsome-theme. The menu consists of textlayers with different links, which are mainly triggers for popup-layersliders. These are popping up well, and within these sliders, I am triggering further Popup-layersliders. And here it stops working.- The new popups open under the slider, that triggered them.  I applied z-index up and down, I went through hundreds of forum threads but the issues I need to solve were only vaguely discussed.

    My MAIN QUESTION:

    How can I gain control over the level of each slider, if z-index does not work? Is it an issue with the flatsome-theme or do I have wrong settings?

    And then:
    Can I place two or more popup-triggers on the layers of only one slide of a slider? It doesnt seem to work out the way I tried it.

    And: How can I set the cursor to become a pointer on hover of the popup-triggers and slidechanger-links?


    Thanks for Your help

    Michele







  • [deleted] replied

    Hello Michele,

    Thank you for getting in touch with us. My name is Attila and I'm happy to assist you today. I appreciate your patience while we've been working towards your ticket.

    You should be able to adjust the slider positions when they are stacked with z-index. You can set the z-index value for the sliders in the Slider Settings -> Appearance -> Custom Slider CSS field. If you order them this way, there should be no problem normally, but I guess it's possible that your theme is interfering with the elements inserted to the page. It's definitely worth taking a look at the theme settings or builder to see if it is affecting z-indexes.

    Yes, you should also be able to set up several triggers inside a single slide, as long as each trigger has its own individual layer that starts it. The selectors and attributes (IDs) also have to be unique for this to work.

    Regarding the cursor, you can apply " cursor: pointer; " to the Custom CSS field of the layers. This should adjust them in a way where a pointer appears when they are hovered over.

  • michele replied

    Thanks for the superfast and accurate answers! Two of the three problems are resolved, but still, the order of stacked layers remains sort of random.

    Some of the pop up sliders  (applying z-index or not) stack above and some underneath the slider that triggers them. I resume them - those not ready to publish - on a test page www.mpagel.com/?page_id=669 especially the trigger "works" shows the problem.

    Within one slider that triggers pop ups, all pop ups react the same way (open above or underneath) but, comparing the settings, I do not find a rule, that applies in order to control it. It seems to depend rather on the slider with the triggers than on the pop up sliders. ... I admit, it leaves me pretty clueless..

    Should I change the theme? And if so, which one should I purchase?

    Thanks for your great support

    Michele

  • michele replied

    an additional question, though it seems unlogical: could it have to do with the selection of the slider skin? Or some other selection in "appearance" or others, that make it impossible to pop up above or underneath? Thanks

    michele

  • [deleted] replied

    I don't think that it can be skin related. Regarding the layer order inside a slider, you can change which one should be top and bottom by reordering them in the layers list at the left. The upmost layer in the list will be on top and so on going to the bottom. We will take another look at your site regarding the z-indexes, maybe we can locate what is causing this misalignment exactly.

  • [deleted] replied

    Thank you for your patience. We've looked into this with the dev team and it seems like that the z-indexes of the parent elements (where the sliders are added) are overwriting the slider z-indexes. So what you need to do is search for each parent element where a slider is included on the page, and change the z-index for that. This should solve the problem.

  • michele replied

    Dear Support-Team; 

    First of all: THANK YOU!!! Both your product and your support are absolutely marvellous.

    I must admit, as a beginner, I didn't see the forest for the trees, when I was on my own. But  - with your help - I am starting to see it better: Nice trees, nice forest!

    I'll try to work with your latest suggestions and hope, I won't need much more help.

    If I do, I know, who to contact.

    Thanks, thumbs up!

    Michele

  • [deleted] replied

    Thank you for the feedback and the kind words. If you need further assistance please let us know.

  • michele replied

    Dear Support Team,

    Actually, there is one tiny issue I can not resolve:

    the URI of my website appears with the appendix: ."/#_no-deeplink-found_"

    I have unselected /deactivate the Settings "Change URI hash" and "use relative Urls" in all my sliders, and I took away all deeplink names in the slide-settings, thinking that this would solve it, but still the "deeplink" is always searched for and therefore not found. Could you please help me out of this one too?

    Thanks, Michele

  • [deleted] replied

    Hello Michele,

    If you have enabled deeplinking before, but there is no actual deeplink anymore on the site, this might happen. You will need to turn off the Slider Settings -> Slideshow -> Show advanced settings -> Change URL hash option.