Skip to content
This repository

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
branch: master
Fetching contributors…

Cannot retrieve contributors at this time

file 74 lines (60 sloc) 4.802 kb
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>
  <head>
    <title>jQuery Grab Bag - Text Effects Plugin</title>
    <link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="http://onehackoranother.com/feed/" />
    <link rel="alternate" type="text/xml" title="RSS .92" href="http://onehackoranother.com/feed/rss/" />
    <link rel="alternate" type="application/atom+xml" title="Atom 1.0" href="http://onehackoranother.com/feed/atom/" />
    <script type='text/javascript' src='javascripts/jquery-1.2.6.min.js'></script>
    <script type='text/javascript' src='javascripts/jquery.text-effects.js'></script>
    <link rel="stylesheet" href="stylesheets/main.css" type="text/css" />
    <style type='text/css'>
      #unscramble,
      #typewriter,
      #scrambled-writer,
      #rot13 { font-family: monospace; border: 1px solid black; padding: 0.5em; min-height: 130px; }
    </style>
  </head>
  <body>
    <div id='container'>
      
      <h1>
        grab bag <span class='subtitle'>- assorted jQuery plugins</span>
      </h1>
      
      <div id='sidebar'>
        <ul id='project-nav'>
          <li><a href='index.html'>Plugin List</a></li>
        </ul>
        <ul id='ohoa-nav'>
          <li><a href='http://onehackoranother.com/feed/' id='subscribe'>Subscribe for updates &raquo;</a></li>
          <li><a href='http://onehackoranother.com/projects/'>Back to projects &raquo;</a></li>
          <li><a href='http://onehackoranother.com/'>Back to onehackoranother.com &raquo;</a></li>
        </ul>
      </div>
      
      <div id='main'>
        
        <h2>Text Effects</h2>
        
        <p>Some fun little text effects. These manipulate <code>$(ele).text()</code> so will
          probably be disastrously broken with inner HTML content.</p>
        
        <h3>ROT-13</h3>
        <p>(also applies ROT-5 to numerics)</p>
        <pre>$("#my-container").rot13();</pre>
        <p><a href='#' onclick='$("#rot13").rot13(); return false;'>Run demo</a></p>
        <div id='rot13'>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 in 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.</div>

        <h3>Typewriter</h3>
        <pre>$("#my-container").typewriter();</pre>
        <p><a href='#' onclick='$("#typewriter").typewriter(); return false;'>Run demo</a></p>
        <div id='typewriter'>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 in 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.</div>

        <h3>Unscramble</h3>
        <pre>$("#my-container").unscramble();</pre>
        <p><a href='#' onclick='$("#unscramble").unscramble(); return false;'>Run demo</a></p>
        <div id='unscramble'>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 in 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.</div>

        <h3>Scrambled Writer</h3>
        <pre>$("#my-container").scrambledWriter();</pre>
        <p><a href='#' onclick='$("#scrambled-writer").scrambledWriter(); return false;'>Run demo</a></p>
        <div id='scrambled-writer'>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 in 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.</div>
        
        <h2>Direct Link</h2>
        
        <p><a href='http://github.com/jaz303/jquery-grab-bag/tree/master/javascripts/jquery.text-effects.js'>jquery.text-effects.js</a></p>
        
      </div>
      
    </div>
  </body>
</html>
Something went wrong with that request. Please try again.