Why does the box shadow on my content divs not mix with my superbgimage/jw player background? Instead of darkening, it creates a grey halo effect. Do box-shadows only work on white backgrounds?
Halo effect instead of shadow blending with background image
CSS for superbgimage background and jQuery Isotope plugin divs
#background {
background: inherit;
}
#superbgimage {
display: none;
}
.item {
margin-bottom: 4px;
-moz-box-shadow: 3px 3px 5px 6px #ccc;
-webkit-box-shadow: 3px 3px 5px 6px #ccc;
box-shadow: 3px 3px 5px 6px #ccc;
}
Divs for background
<fieldset id="background">
<a href="media/background_0.jpg"></a>
<a href="media/background_1.jpg"></a>
<a href="media/background_2.jpg"></a>
...
</fieldset>
<div id="superbgimage"></div>
Script for background
<script type="text/javascript">
$(document).ready(function () {
$.fn.superbgimage.options = {
preload: 1,
randomtransition: 0,
slideshow: 1,
slide_interval: 9000,
randomimage: 1,
speed: 3000,
transition: 1
};
$('#background').superbgimage().hide();
});
</script>