Columnize plugin problems in IE

classic Classic list List threaded Threaded
1 message Options
Reply | Threaded
Open this post in threaded view
|

Columnize plugin problems in IE

ewhite
I'm working on a page that uses the Columnize plugin to organize a set of divs into two columns.

The behavior that I want (and which works in FF & Safari) is this: when the page loads, all .speakers divs are hidden except for one (specified by script). Clicking on an H3 toggles the visibility of the next .speakers div and hides the one that is open.

In IE 7 & 6, this only works if I turn delete this line: jQuery('.columns').columnize({ columns: 2 });
To be more specific: clicking on the first H3 closes & opens the visible .speakers div. Clicking on any other H3 does nothing. If columnizing is disabled, the slideUp/slideDown functions work fine.

Ideas or work arounds would be much-appreciated! Thanks, Esther

URL: http://verbatimlectures.com/wordpress/ideas/

The divs follow this format:
<div id="issue-#" class="issue">
     <h3>Issue Name</h3>
     <div id="speakers-issue-#" class="speakers">
 				<div id="speaker-#-issue-#" class="speaker">
				<img src="headshot src">
				<h4 class="entry-title"><a href="speaker-permalink">Speaker Name</a></h4>
				<p class="tagline">Tagline text</p>
				<div class="clearfix">&nbsp;</div>
			</div> <!-- #speaker-% -->
	</div> <!-- #speakers-% -->
</div> <!-- .isssue -->

Here is my script:
jQuery(document).ready(function() {

	<!-- Columns & Toggling -->
	jQuery('.issue').addClass("dontsplit");
	jQuery('.speakers').addClass("dontsplit");
	jQuery('.columns').columnize({ columns: 2 });
	jQuery('.speaker-excerpt').addClass("dontsplit");

  	jQuery('div.speakers').hide();
  	jQuery('div#speakers-business').slideToggle("fast");
  	jQuery('.issue > h3').click(function () {
   		jQuery('div.speakers').slideUp("fast");
   		jQuery(this).next('div.speakers:hidden').slideDown("fast");		     	
  	});
});