Blog / Drupal expand teaser to full body
We had the need to expand the teaser to full node body on click.
We created a view with both teaser and body, then we swap them with a bit of jQuery in the footer of the view:
<script type="text/javascript">
if (Drupal.jsEnabled) {
$(document).ready(function() {
$('#campaign_overview').find('div.views-field-body').hide();
//$('#campaign_overview').find('img').hide(); // can hide images in teaser, but we want them after all
$('#toggle_teaser').click(function() {
$('#campaign_overview').find('div.views-field-teaser').slideToggle('fast');
$('#campaign_overview').find('div.views-field-body').slideToggle('fast');
//$('#campaign_overview').find('img').slideToggle('fast');
if ($('#toggle_teaser').html()=='<a href="#">[+] read more</a>') {
$('#toggle_teaser').html('<a href="#">[-] read less</a>');
}
else {
$('#toggle_teaser').html('<a href="#">[+] read more</a>');
}
return false;
}); // $('#toggle_teaser').click(function()
}) // end $(document).ready(function()
} //end if (Drupal.jsEnabled)
</script>
<div id="toggle_teaser"><a href="#">[+] read more</a></div>


Leave a comment