Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!DOCTYPE html>
- <html>
- <head>
- <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
- <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
- <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
- <style>
- #corkboard { position: relative; }
- #corkboard textarea { position: absolute; width: 380px; height: 300px; top: 100px; left: 60px; background: none; border: none; font-size: 24px; color: #03f; font-family: 'comic sans ms', serif; }
- #corkboard img { position: absolute; }
- .corkboard-item {
- position: absolute;
- float: left;
- width: 500px;
- height: 500px;
- }
- </style>
- <script>
- $( document ).ready( function() {
- // Create our corkboard item
- //
- $corkboard_item = $( '<div></div>' );
- $corkboard_item
- .addClass( 'corkboard-item' )
- .append( '<img src="http://www.bookofsam.com/corkboard/Sticky_Note.png" />' )
- .append( '<textarea name="comments" x-webkit-speech="x-webkit-speech">Enter your note</textarea>' );
- // Counter goodness
- $x = 1;
- // Make sure the one we click is always at the top
- //
- $( 'img, textarea' ).live( 'click', function( e ) {
- e.preventDefault();
- $( '.corkboard-item' ).each( function() {
- $( this ).css({ 'z-index':1 });
- });
- $( this )
- .parent()
- .css({
- 'z-index':2
- })
- });
- // Add one when we click the button
- //
- $( 'a.add-item' ).live( 'click', function( e ) {
- e.preventDefault();
- var item = $corkboard_item.clone();
- $( item )
- .find( 'textarea' )
- .attr({
- 'name' : ( 'comment-' + $x )
- });
- $x++;
- $("#corkboard").append( $( item ).draggable() );
- });
- });
- </script>
- </head>
- <body>
- <p>CORKBOARD TEST - 0.8.555 </p>
- <a href="#" class="add-item"><img src='http://www.bookofsam.com/corkboard/Note_Scale.png' align="right" /></a>
- <div id="corkboard"></div>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement