In the right column you´ll find a blue dropdown stack button with the text „Zum Urlaubs-Finder".
When I click the button to reveal the submenu in safari, it is hidden behind the content which is placed below.
This also happens, when I place the stack in the left column. I tried it above the first paragraph, in the middle of that paragraph, below the paragraph etc.
In Chrome and Firefox the pulldown menu shows well placed in front of other contents no matter where I place it.
What can I do to fix this safari issue with the stack?(z-index??)
One more thing: I tried to use custom colors for styling the submenu.
I found out that a chosen dropdown hover background color is shown in preview and all browsers while the dropdown hover text color is ignored in each of them. (instead, the regular dropdown text color is shown)
Maybe a bug? m I missing something?
@Adam: is there a chance that you can have a look at the Site? Currently the site is not officially online, but the client is already inpatient.
I would like to have the dropdown working in safari. at least I would like to know if it is something that can be fixed shortly.
The color issue is not of such a big importance.
Thanks in advance!
If you post up a link to a ZIP file containing your project file I can have a look at it a bit for you. If you’re under deadline, and the Drop Down stack is working for you when not using the Reveal stack, then I would suggest going that route to meet your deadline. I mention this because we currently have a huge hurricane headed our way, so my time will be limited for work over the coming days most likely. I will check back in here later today though, so if you post that project file I will have a look.
That being said, if it ends up being a bug that needs fixing it will be in the next update, and will not happen immediately, so even then you will likely want to implement a working solution instead of the animated version.
As for the Drop Down – I’m seeing the problem in Safari, but within Chrome and Firefox it looks fine, as you mentioned.
Changing the z-index of the Drop Down is not going to help. The problem originates with the way the animation is rendered. We make use of one of the most widely used CSS animation libraries out there call Animate.CSS. It sets an animation-fill-mode that is required of the animations to make sure they display properly. Safari is not rendering it properly it seems. Whether it is a Safari bug or how they intend for the browser to render this fill mode I am unsure, but that is where the problem originates.
I can’t change this fill mode, as I suspect it will cause problems for the Reveal stack and the way it is supposed to work. My suggestion would to remove the Drop Down stack from within the Reveal stack and use it as-is.
I wanted to catch attention – that´s why the reveal stack is essential at this point, because the button would´t stand out enough without any animation.
I tried to achieve a similar result by using BWD ButtonPlusv2 and PopDrop, so I am fine for now.
The javascript belongs to the Analytics Code, which is not working in this sandbox state.
The final thing that has not been answered is the behavior of the color settings for the dropdown stack that are not fully working as expected. Maybe this is something you can have a look at as soon as workload decreases.
I have not seen the problem you’re outlining. Can you provide me some screenshots of what it should be and what you’re seeing so I can replicate it here?
the hover text color simply won´t match the stack settings (here: cyan) – it remains „dropdown text color" (here:white)
The screenshot shows the solo dropdown stack (not wrapped in reveal stack or any other)
