Update to jQuery/CSS Expandable Content
I updated the expandable div code today to accomodate divs that are shorter (and thus don't need to be expanded). It's a simple change:
<script type="text/javascript">
$(document).ready(function () {
// expander
$('.expandme').each(function(){
if($(this).height() > 450){
$(this).removeClass('expandme');
$(this).addClass('expand');
$('<a class="expander">See More...</a>')
.attr('href', '#' + $(this).attr('id'))
.click(function(){
$(this).parent().toggleClass("expand", 500);
$(this).hide();
return false;
})
.appendTo($(this));
}
});
});
</script>
And then you just change the class on the expandable div to be 'expandme' instead of 'expand.'
<div id="topten" class="expandme">
<h2>Top 10 Resources</h2>
<ol>
<li>List items go here...</li>
</ol>
</div><!-- end topten -->
Post new comment