I am experimenting an expand/collapse feature which works on most browsers but IE7, FF 3 OSX/Win.
You can see the expand/collapse feature on one of the titles (What We’re Reading: Obama names new envoy to Sudan) in this blog: http://www.one.org/blog/.
Here's the code on the head section:
<script language="JavaScript" type="text/javascript"><!--
function expand(param) {
jQuery("div"+param).stop().slideToggle("slow", function() {
linkname = jQuery("a"+param).html();
if( jQuery("div"+param).is(":visible") ) {
jQuery("a"+param).html(expand_text+" "+linkname.substring(collapse_text_length));
}
else {
jQuery("a"+param).html(collapse_text+" "+linkname.substring(expand_text_length));
}
});
}
function expander_hide(param) {
jQuery("div"+param).hide();
linkname = jQuery("a"+param).html();
collapse_text = "▼ Show More";
expand_text = "▲ Show Less";
collapse_text_length = jQuery("<span />").html(collapse_text).text().length;
expand_text_length = jQuery("<span />").html(collapse_text).text().length;
jQuery("a"+param).html(collapse_text + " " + linkname);
jQuery("a"+param).show();
}
//--></script>
The code inside the body text of the blog is:
<a style="display:none;" id="te753358020" href="javascript:expand('#te753358020')"> </a>
<div class="te_div" id="te753358020"><script language="JavaScript" type="text/javascript">expander_hide('#te753358020');</script><a href="http://www.nytimes.com/2011/04/02/world/africa/02ivory.html?_r=1&ref=afr开发者_开发问答ica"><br />
When I try to click the Show More link, it doesn't respond. The text that should be hidden is also displayed in IE7.
What would be the work-around for this?
Thanks,
I suggest opening the page in IE7, add some debug messages to see on which line of expander_hide it fails on.
精彩评论