Browse files

replaced html file with a more generic readme file

  • Loading branch information...
1 parent 273b3de commit b753c14027995e00a873937876890bd8cb9376e7 Karl Swedberg committed Oct 7, 2009
Showing with 36 additions and 131 deletions.
  1. +2 −1 .gitignore
  2. +0 −130 index.html
  3. +34 −0 readme.textile
View
3 .gitignore
@@ -1,2 +1,3 @@
*.DS_Store
-lib/*
+lib/*
+index.html
View
130 index.html
@@ -1,130 +0,0 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
-<head>
-<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
-<title>jQuery Expander Plugin</title>
-<link rel="stylesheet" type="text/css" media="screen" href="../jq.css" />
-<link rel="stylesheet" type="text/css" media="screen" href="../tabs.css" />
-<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
-<script type="text/javascript" src="../jquery.tabs.min.js"></script>
-<script type="text/javascript" src="../jquery.history.pack.js"></script>
-<script type="text/javascript" src="../chili-1.8.js"></script>
-
-<script type="text/javascript">
-
-$(function() {
- // initialize the tabs
- var main = $('#main').tabs(1);
- // $('#subdetails').tabs( { selectedClass: 'sample-tab-selected', bookmarkable: false });
-
-});
-
-</script>
-</head>
-<body>
-<div><a id="logo" href="http://jquery.com" title="Powered By jQuery"></a></div>
-<h1 id="banner"><a id="backnav" href="..">&lsaquo;&lsaquo; home</a>jQuery Expander Plugin</h1>
-<div id="main">
- <ul id="nav" class="anchors">
- <li><a href="#getting-started">Overview</a></li>
- <li><a href="/expander/demo/index.html">Demo</a></li>
- <li><a href="#options">API / Options</a></li>
- <li><a href="#download">Download &amp; Support</a></li>
- </ul>
- <div id="getting-started" class="tabContent">
- <h1>Overview</h1>
- <p>The Expander Plugin is a simple little jQuery plugin to hide/collapse a portion of an element's text and add a "read more" link so that the text can be viewed by the user if he or she wishes. By default, the expanded text is followed by a "re-collapse" link. Expanded text can also be re-collapsed at a specified time.</p>
- <p>If you like this plugin and you're feeling generous, perhaps you'd also like to visit my <a href="http://www.amazon.com/gp/registry/wishlist/1NLSYA46XTVG4/" title="Amazon.com: Wish List">amazon.com wish list</a>?</p>
- <h1>Quick Start Guide</h1>
-
- <div class="step-one">Add HTML markup to your page for elements that you want to be expandable. For example:</div>
-<pre><code class="mix">
- &lt;div class=&quot;expandable&quot;&gt;
- &lt;p&gt;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.
- &lt;/p&gt;
- &lt;p&gt;Reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
- Excepteur sint occaecat cupidatat non proident, sunt in culpa qui
- officia deserunt mollit anim id est laborum.
- &lt;/p&gt;
- &lt;/div&gt;
-</code></pre>
- <div class="step-two">Include the <strong>jQuery</strong> core file and the <strong>Expander</strong> plugin in the <code>&lt;head&gt;</code> of your document. After these scripts are referenced, you can reference a custom script file to modify the expandable elements (preferred) or enter the script directly in the <code>&lt;head&gt;</code> (shown below).</div>
- <br />
-<pre><code class="mix">&lt;script src="jquery.js" type="text/javascript"&gt;&lt;/script&gt;
-&lt;script src="jquery.expander.js" type="text/javascript"&gt;&lt;/script&gt;
-
-&lt;script type="text/javascript"&gt;
-$(document).ready(function() {
-
- // simple example, using all default options
- $('div.expandable p').expander();
-
- // *** OR ***
-
- // override some default options
- $('div.expandable p').expander({
- slicePoint: 80, // default is 100
- expandText: '[...]', // default is 'read more...'
- collapseTimer: 5000, // re-collapses after 5 seconds; default is 0, so no re-collapsing
- userCollapseText: '[^]' // default is '[collapse expanded text]'
- });
-
-});
-&lt;/script&gt;
-
-</code></pre>
- <p>See <a href="#options">API / Options</a> for more ways to customize the behavior and appearance of the expander.</p>
- </div>
- <div id="demo" class="tabContent"></div>
- <div id="options" class="tabContent">
- <h1>Expander Plugin API / Options</h1>
- <p>The Expander Plugin API provides a single method with a few options.</p>
- <p>Please send bug reports or feature requests to the <a href="groups.google.com/group/jquery-en/">jQuery Google Group</a>.</p>
- <dl>
- <dt><code class="method">expander(options)</code></dt>
- <dd>Truncates an element's visible text at a specified location, collapsing the rest and allowing the user to expand it if he or she wishes. </dd>
- </dl>
-<pre><code class="mix">$.fn.expander.defaults = {
- slicePoint: 100, // the number of characters at which the contents will be sliced into two parts.
- // Note: any tag names in the HTML that appear inside the sliced element before
- // the slicePoint will be counted along with the text characters.
- widow: 4, // a threshold of sorts for whether to initially hide/collapse part of the element's contents.
- // If after slicing the contents in two there are fewer words in the second part than
- // the value set by widow, we won't bother hiding/collapsing anything.
- expandText: 'read more...', // text displayed in a link instead of the hidden part of the element.
- // clicking this will expand/show the hidden/collapsed text
- expandPrefix: '&hellip; ', // text to come before the expand link
- collapseTimer: 0, // number of milliseconds after text has been expanded at which to collapse the text again
- expandEffect: 'fadeIn',
- expandSpeed: '', // speed in milliseconds of the animation effect for expanding the text
- userCollapse: true, // allow the user to re-collapse the expanded text.
- userCollapseText: '[collapse expanded text]', // text to use for the link to re-collapse the text
- userCollapsePrefix: ' ', // text to come before the re-collapse link
- beforeExpand: function($thisEl) {}, // function that is called immediately upon expanding, before the expand occurs
- afterExpand: function($thisEl) {}, // function that is called after the details have finished expanding
- onCollapse: function($thisEl, byUser) {} //function that is called when the details are collapsed (immediately after)
-
-};
-</code></pre>
-
- </div>
-
- <div id="download" class="tabContent">
- <h1>Download</h1>
- The Expander Plugin is available at:
- <a class="external" href="http://plugins.learningjquery.com/expander/jquery.expander.js">http://plugins.learningjquery.com/expander/jquery.expander.js</a>.
-
- <h1>Support</h1>
- <p>Support for the Expander Plugin is available through the
- <a class="external" href="http://groups.google.com/group/jquery-en/">jQuery Mailing List</a>.
- This is a very active list to which many jQuery developers and users subscribe.</p>
-
- <div id="footer">
- This documentation is maintained by Karl Swedberg. Send comments or questions to karl [at] learningjquery [dot] com.
- </div>
- </div>
-</div> <!-- main -->
-
-</body></html>
View
34 readme.textile
@@ -0,0 +1,34 @@
+h2. Overview
+
+The Expander Plugin is a simple little jQuery plugin to hide/collapse a portion of an element's text and add a "read more" link so that the text can be viewed by the user if he or she wishes. By default, the expanded text is followed by a "re-collapse" link. Expanded text can also be re-collapsed at a specified time
+
+The plugin consists of single method, .expander(), with a bunch of options.
+
+h3. Options
+
+I need to clean up the options object. Until I get around to it, the following options are currently available:
+
+ <pre>
+ slicePoint: 100, // the number of characters at which the contents will be sliced into two parts.
+ // Note: any tag names in the HTML that appear inside the sliced element before
+ // the slicePoint will be counted along with the text characters.
+ widow: 4, // a threshold of sorts for whether to initially hide/collapse part of the element's contents.
+ // If after slicing the contents in two there are fewer words in the second part than
+ // the value set by widow, we won't bother hiding/collapsing anything.
+ expandText: 'read more', // text displayed in a link instead of the hidden part of the element.
+ // clicking this will expand/show the hidden/collapsed text
+ expandPrefix: '&hellip; ',
+ collapseTimer: 0, // number of milliseconds after text has been expanded at which to collapse the text again
+ expandEffect: 'fadeIn',
+ expandSpeed: '', // speed in milliseconds of the animation effect for expanding the text
+ userCollapse: true, // allow the user to re-collapse the expanded text.
+ userCollapseText: '[collapse expanded text]', // text to use for the link to re-collapse the text
+ userCollapsePrefix: ' ',
+
+ /* CALLBACK FUNCTIONS
+ ** all functions have the this keyword mapped to the element that called .expander()
+ */
+ onSlice: null, // function() {}
+ beforeExpand: function() {},
+ afterExpand: function() {},
+ onCollapse: function(byUser) {}</pre>

0 comments on commit b753c14

Please sign in to comment.