css works for firefox but not ie or chrome. How to fix the css so that at least IE works like firefox.
Firefox:
IE:
The image is in the background as well but should be transparent.
Chrome:
The HTML:
<center><div id="slideshowContentArea" style="display:none开发者_高级运维; width:500px; height:300px">
<div class='nav'><a id='prev' href='#'>Prev</a>  <a id='next' href='#'>Next</a></div>
<div id="slideshow" class="pics" style="position: relative; overflow-x: hidden; overflow-y: hidden; height:250px; width:395px"> </div>
</div></center>
$('#slideshow').cycle(
{ fx: 'fade', timeout: 3000, speed: 500,
pager: '#slideshow', before: setBGBefore, prev:'#prev',next:'#next',after:onAfter
}
);
function setBGBefore() {
$(this).css({ 'background-image': 'url(' + $(this).find('img').attr('src') + ')',
'background-position': 'center top', 'background-color': 'transparent' });
$(".welcomeBox div").html($(this).find('span').html());
}
jQuery can tell you the browser in use:
http://api.jquery.com/jQuery.browser/
Update. The question title was "check for chrome, ie & firefox" that's what I've answered. It's up to the OP if he wishes to implement a more elegant solution.
精彩评论