works in ie9 and ff4 - not in ie7 or ie 8?
Question
I wrote this script awhile back and have modified it to use css sprites to cut down on images. Everything works perfect in ie9 and ff4, however, I noticed it will not show in ie7/ie8... It must be a css or js problem, but I certainly cannot see anything that would be preventing the older ie's from displaying the code...
I have included the entire contents below in a 'test' page which includes everything... if someone can point me out to why this is not working in ie7 or ie8 I would be very grateful!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<style type="text/css">
#social16 {height:16px;font-size:13px; color:#0066ff; font-weight:bold;}
#sb16 {margin: 0px; padding:0px; height:16px; display: inline;line-height:16px;}
#sb16 li {list-style-type:none;float:left;padding:0 5px 0 0;}
#sb16 li a {background:url(social.png);background-repeat:no-repeat;display: block;height: 16px;width:16px;}
#sb16 li a.item0 {background-position:0px 0px;}
#sb16 li a.item1 {background-position:-16px 0px;}
#sb16 li a.item2 {background-position:-32px 0px;}
#sb16 li a.item3 {background-position:-48px 0px;}
#sb16 li a.item4 {background-position:-64px 0px;}
#sb16 li a.item5 {background-position:-80px 0px;}
#sb16 li a.item6 {background-position:-96px 0px;}
</style>
</head>
<body>
<div id="social16"></div>
<script type="text/javascript">
(function(){
var sites = [
['Send to Facebook', 'http://www.facebook.com/sharer.php?u={url}&t={title}'],
['Tweet This', 'http://twitter.com/share?text={title}&url={url}'],
['Send to StumbleUpon', 'http://www.stumbleupon.com/submit?url={url}&title={title}'],
['Digg This', 'http://digg.com/submit?phase=2&url={url}&title={title}'],
['Send to GoogleBuzz', 'http://www.google.com/buzz/post?message={title}&url={url}'],
['Send to Reddit', 'http://reddit.com/submit?url={url}&title={title}'],
['Email to Friends', 'mailto:?subject={title}&body={url}'],
];
var url = encodeURIComponent(location.href),
url = url.replace( "#", "" ),
title = encodeURIComponent(document.title),
html = '<ul id="sb16"><li>Share this ... </li>';
for (var i = 0, len = sites.length; i < len; i++) {
var site = sites[i],
link = site[1].replace('{url}', url).replace('{title}', title);
html += '<li><a class="item' + i + '" href="#" title="' + site[0] + '" onclick="window.open(\'' + link + '\')"></a></li>';
}
html += '</ul>';
document.getElementById("social16").innerHTML=(html);
})();
</script>
</body>
</html>
2 answers
solution1
2 2011-05-17 03:23:23
var sites = [
...
['Email to Friends', 'mailto:?subject={title}&body={url}'],
];
Your last element has a trailing , . Remove it.
solution2
2 ACCPTED 2011-05-17 03:24:17
You have a comma after the last element of sites :
var sites = [
//...
['Email to Friends', 'mailto:?subject={title}&body={url}'],
// -----------------------------------------------------------^
];
IE6 and IE7 don't like that. This usually shows up as a null at the end of the array and you end up with a null where you don't expect one.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.