I have created a simple slider using jssor, and it works fine in Chrome. However, when I view the same slide in IE 11, the text is missing (but the background image is present).
Can someone tell me what is wrong with this code - why won't the text show up in IE 11? When I visit the jssor.com website with IE the demos work fine.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="/include/jquery/slider-master/js/jssor.slider.mini.js"></script>
</head>
<body>
<div id="content">
<div id="panel_topslider" style="position: relative; top: 0px; left: 0px; width: 500px; height: 350px;">
<div data-u="slides" style="cursor: move; position: absolute; overflow: hidden; left: 0px; top: 0px; width: 500px; height: 350px;">
<div>
<img data-u="image" src="/images/banners/911-call-center.jpg" alt="911 call center"/>
<div style="color:white;font-size:200%;">THIS TEXT DOES NOT SHOW UP IN IE 11</div>
</div>
</div>
</div>
</div>
<script>
jQuery(document).ready(function ($) {
options = { $AutoPlay: true, $FillMode: 1, $AutoPlayInterval: 8000 };
valueobject = new $JssorSlider$('panel_topslider', options);
});
</script>
</body>
</html>
Please specify position
, top
and left
for the element.
<div style="position: absolute; top: 0px; left: 0px; color:white;font-size:200%;">THIS TEXT WILL SHOW UP IN IE 11</div>