Follow his steps below:
<script type="text/javascript" src="
http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script src="http://yourjavascript.com/25106160012/aktechz-notepad-script.js">
</script>
<style type="text/css"> .notepad{ border:1px solid gray; background:lightyellow; box-
shadow: 0 0 12px #818181; -webkit-box-shadow: 0 0 12px #818181; -moz-box-shadow: 0 0 12px
#818181; width:280px; padding:7px 10px; position:absolute; cursor:pointer; }
.notepad h3{ margin:5px 0; }
.notepad .close{ float:right; font-weight:bold; text-align:center; display:block;
}
.notepad form{ margin:0; padding:0; }
.notepad form fieldset{ margin-top:1em; }
.notepad form legend{ font-weight:bold; }
.notepad form input[type=text]{ width:98%; }
.notepad form textarea{ width:98%; height:150px; }
.notepad form a.control{ text-decoration: none; padding: 2px 20px; text-align:center;
margin:5px 0; display:block; margin-top:5px; font:bold 13px Verdana; border: 1px solid #778;
color: white; border:1px solid gray; background: green; border-radius: 8px; /*w3c border
radius*/box-shadow: 3px 3px 4px rgba(0,0,0,.5); /* w3c box shadow */-moz-border-radius: 8px;
/* mozilla border radius */-moz-box-shadow: 3px 3px 4px rgba(0,0,0,.5); /* mozilla box
shadow */background: -moz-linear-gradient(center top, #7ad690, #3ec05c 25%, #298a40 45%,
#3ec05c 85%, #7ad690); -webkit-border-radius: 8px; /* webkit border radius */-webkit-box-
shadow: 3px 3px 4px rgba(0,0,0,.5); /* webkit box shadow */background: -webkit-gradient
(linear, center top, center bottom, from(#7ad690), color-stop(25%, #3ec05c), color-stop(45%,
#298a40), color-stop(85%, #3ec05c), to(#7ad690)); }.notepad form a.delete{ background:
darkred; background: -moz-linear-gradient(center top, #f5795d, #e55e3f 25%, #d02700 45%,
#e55e3f 85%, #f5795d); background: -webkit-gradient(linear, center top, center bottom, from
(#f5795d), color-stop(25%, #e55e3f), color-stop(45%, #d02700), color-stop(85%, #e55e3f), to
(#f5795d)); }
.notepad:before{ /*top left tape effect*/content: ''; position:absolute; width: 120px;
height: 25px; border-left: 1px dashed rgba(0, 0, 0, 0.1); border-right: 1px dashed rgba(0,
0, 0, 0.1); background: rgba(0, 0, 0, 0.1); background: -webkit-gradient(linear, 555% 20%,
0% 92%, from(rgba(0, 0, 0, 0.1)), to(rgba(0, 0, 0, 0.0)), color-stop(.1,rgba(0, 0, 0,
0.2))); background: -moz-linear-gradient(555% 0 180deg, rgba(0,0,0,0.1), rgba(0,0,0,0.2)
10%, rgba(0,0,0,0.0)); -webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2); box-shadow: 0px
0px 12px rgba(0, 0, 0, 0.2); -webkit-transform:translate(-70px,0) skew(10deg,10deg) rotate
(-50deg); -moz-transform:translate(-70px,0) skew(10deg,10deg) rotate(-50deg); -o-
transform:translate(-70px,0) skew(10deg,10deg) rotate(-50deg); -ms-transform:translate(-
70px,0) skew(10deg,10deg) rotate(-50deg); transform:translate(-70px,0) skew(10deg,10deg)
rotate(-50deg); }
</Style>
- Save.
- After saving your template, go to Layout > Add a Gadget > HTML/Javascript widget and paste the following.
<a href="javascript:notepad.loadpad('mynotepad2')">
Click to open notepad </a>
Note: You may replace ‘Click to open notepad’ with your own instructions.- Save.
0 comments:
Post a Comment