May 29, 2013 at 10:38 am #23991
I like the inset shadow of the layerslider, however, it’s always overridden. You see this as well on the enfold demo home page.
As soon as the image fades in, the inset shadow fades away as well.
I’ve tried adding inset box shadow on practically all possible layer classes (eg ls-inner, ls-container, etc), but always it fades away.
Can someone show me how it’s done?
ThanksMay 29, 2013 at 10:45 am #121918
This should work:
-moz-box-shadow: inset 0 0 10px #000000 !important;
-webkit-box-shadow: inset 0 0 10px #000000 !important;
box-shadow: inset 0 0 10px #000000 !important;
}May 29, 2013 at 11:17 am #121919
it works, but it becomes overridden by something, just like in the enfold homepage. You initially see there’s inner shadow applied, but it fades away after a sec or so.
Believe me, I’ve applied this to all possible classes, like I wrote above. Try it yourself.
I even put a z-index of 99 to the ls-inner (just to test) and still it fades away after 1 sec. This is in the original install, no tweaks yet.May 29, 2013 at 11:27 am #121920
It works for me and doesnt fade, with a background image it doesnt show for me. Perhaps try adding a div at the top of the slide with 100% width and minimal height with css in LayerSilder settings?May 29, 2013 at 12:02 pm #121921May 29, 2013 at 12:36 pm #121922
It seems all images cover the inner inset shadow, no matter what I do, even if I apply it on the layer class itself. When I put in a blank it shows.
Though should be somehow easily done with CSS, I don’t get it.May 29, 2013 at 12:56 pm #121923
Ok, I did it the hardcore way then.
if one needs to achieve this:
line 235 of slider.php: add a div with unique id like this:
$data .= '</div><div id="ls-mask"></div>';
then add in your custom.css this:
top: 0px; left: 0px;
box-shadow: 0 0 10px #000000 inset;
Works always consistently on all sliders without doing tricky stuff within the slider itself.
The topic ‘layerslider inner shadow’ is closed to new replies.