is an open-source jQuery plugin by Elliott Kember
which lets you share in the beauty of the page fold.
You want a demo page? You're looking at it.
The source code is available at GitHub.
People tell me it doesn't work in IE. If you can make it work, let me know.
First, make sure you're using jQuery and jQuery
UI (version 1.5 works)
You'll need the resizable package in jQuery UI.
Then install the source code into a directory called turn in your public directory.
Insert this code into your page:
<script type="text/javascript" src="turn/turn.js"></script> <link rel="stylesheet" type="text/css" href="turn/turn.css">
Then, create an element to show behind the curl.
Personally, I use an image of a code sample, but you can use whatever you like.
<img id="target" src="turn/code.png">
Now, all you have to do is call the function like this:
$(document).ready(function(){ $( '#target' ).fold(); });
You should be set! Stand by for thousands of admirers.
Not exactly what you want? Huh? Well, luckily you're so awesome that I've included some options:
// Default awesomeness var defaults = { directory: 'turn', // The directory we're in side: 'left', // change me to "right" if you want rightness turnImage: 'fold.png', // The triangle-shaped fold image maxHeight: 400, // The maximum height. Duh. starting_width: 80, // The height and width starting_height: 80 // with which to start };
Feel free to mess with them and try and get it to work best for you.
If you're looking at the advanced options, you're probably a clever clogs anyway.
Elliott Kember did. That's me.
You can visit my site here.
It looks a lot like the site you're on now.
This plugin is released under the MIT license.
That means you can do whatever you damn well please with it.
You can copy, modify, merge, publish, distribute, sublicense, and/or sell copies
You can even print it out and wear it as a hat if you like.
But please, use it wisely. If it starts popping up everywhere and becomes
“that annoying javascript thing”, I'll be very upset.