-
Posts
-
Hello, i would like to place a div containing images and a map over top of the slider (not above it, but as a layer, over it). I have used images over the slider before by coding them into the caption field of a slide however when i try to insert a div things go a bit haywire.
Can you recommend a better way to have a div appear as a layer overtop of the slider, centered?
Hey HostageMedia,
Try adding a new layer using the html layer choice which should allow a div container.Best regards,
MikeHi,
In your slider when editing, click the “Add New” then you will get a drop down, then choose HTML
Best regards,
MikeI see that on the Enfold Medical demo the blue boxes are pulled up over the slider a bit, how is that accomplished? Thank you in advance.
Hi,
Oh I see now, you can use negative margin to move a element up and on top of your slider.
Try adding your element to your page right under your slider, and give it a custom ID “myid” (or any other). Then add following code to Quick CSS in Enfold theme options under Styling tab#myid { background-color: transparent!important; margin-top: -55px; z-index: 55; border: none!important; }Please adjust the negative margin to suit.
Best regards,
MikeHey Mike, thanks for the continued help. We’re definetly getting closer however i still have two issues after setting the neg margin;
1) The slider is over-top of the addition. I tried placing the slider under them in order on the page however it didn’t want to move up behind them when given a negative margin.
2) that same affect when i hover over the images is happening, they are jumping around. Perhaps related to the theme’s image hover effect?Any thoughts, or other possible suggestions? thank you again.
Hi HostageMedia,
Have you considered using Layer Slider? It has many options and you can build different layers on any slide, position them the way you need. It comes with the theme. You might want to give it a try.
If you need further assistance please let us know.
Best regards,
VictoriaHi Victoria,
So is that to say that the above prescribed solution that was provided is not workable? There is no work around of the issue im experiencing on the sample at cvbee.com where the theme is creating a mouse-over issue with the elements (when pulled up but behind the slider, and when included in the slider as a caption)?1) Yes, i have tried the Advanced Layerslider and it does not appear to accomplish this effect, please see my example.
2) The blue boxes element is pulled up over top of the slider in the Enfold Medical theme, but when i add it using the method provided it is behind the slider; why?Hi,
I created a template of your text block of the artists should you want to use it again:
because I replaced it with a code block with the same code. I then used this css in the General Styling > Quick CSS field:#fullscreen_slider_1.avia-fullscreen-slider {z-index: 0 !important;} #artists { background-color: transparent!important; margin-top: -90vh; z-index: 50; border: none!important; max-height: 90vh; }and got the results in the screenshot in Private Content area.
I believe this is what you were looking for, is this correct?
Please clear your browser cache and check.Best regards,
MikeHi Mike, that is exactly what i am trying to accomplish, thank you, however your version still has the same issue of the images jumping around when you move a mouse over them. I am seeing this across browsers; it loads fine but when you mouse over each image it break onto a new line while showing a mouse-over effect from the theme.
Are you seeing that too? (link to screenshot in private content)
Hi,
Please add this css code to fix the “jump” issue.
#artists .art1 a, #artists .art2 a { float: left; }Best regards,
IsmaelHi,
Glad we could help!
Please take a moment to review our theme and show your support https://themeforest.net/downloads
To know more about enfold features please check – http://kriesi.at/documentation/enfold/
Thank you for using Enfold :)Best regards,
Basilis
- The topic ‘Placing a div over the full width slider’ is closed to new replies.