Issue with JQuery Sparkline in IE
-
06-07-2019 - |
Question
I used jQuery sparkline (http://omnipotent.net/jquery.sparkline/) in a page. This gives me problem in IE if the container DIV is not big enough to show it, tried with Firefox/Chrome, it is working fine. See the sample code,
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<script type="text/javascript" src="jquery-1.3.1.js"></script>
<script type="text/javascript" src="jquery.sparkline.min.js"></script>
<script type="text/javascript">
$(function() {
var myvalues = [10,8,5,7,4,4,1];
$('.dynamicsparkline').sparkline(myvalues, {height:'100px',width:'300px'});
});
</script>
</head>
<body>
<div style="height:100px;width:400px;overflow:auto;border:1px solid black">
Testing Header
<br/>
<span class="dynamicsparkline">Loading..</span>
<br/>
Testing Footer
</body>
</html>
Can anyone help me here?
Thanks, Manoj
Solution
Gareth Watts(http://omnipotent.net/jquery.sparkline/) helped me to solve this issue by adding "position:relative" to the container div.
here is the code
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<script type="text/javascript" src="jquery-1.3.1.js"></script>
<script type="text/javascript" src="jquery.sparkline.min.js"></script>
<script type="text/javascript">
$(function() {
var myvalues = [10,8,5,7,4,4,1];
$('.dynamicsparkline').sparkline(myvalues, {height:'100px',width:'300px'});
});
</script>
</head>
<body>
<div style="height:100px;width:400px;overflow:auto;border:1px solid black;position: relative">
Testing Header
<br/>
<span class="dynamicsparkline">Loading..</span>
<br/>
Testing Footer
</div>
</body>
</html>
It can be reproduced only in IE7.
Thanks
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow