Overview
The Summarize Plugin allows you to choose a number of "child" elements (e.g. paragraphs) to initially display as a summary, with a "read more" link that reveals the rest of the child elements when clicked.If you like this plugin and you're feeling generous, perhaps you'd also like to visit my amazon.com wish list?
Quick Start Guide
Add HTML markup to your page for elements that you want to be expandable. For example:
<div class="expandable">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor.
</p>
<!-- etc. -->
</div>
Include the jQuery core file and the Summarize plugin in the
<head>
of your document. After these scripts are referenced, you can reference a custom script file (preferred) to modify the expandable elements or enter the script directly in the <head>
(shown below).<script src="jquery.js" type="text/javascript"></script>
<script src="jquery.summarize.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
// simple example, using all default options
/***** apply the summarize() method to the "containing" element ****/
$('div.expandable').summarize();
});
</script>
See API / Options for more ways to customize the behavior and appearance of the summarize.
No comments:
Post a Comment