Нашел небольшой скрипт который позволяет Вашим пользователям оставлять любые заметки, записи для себя. Эти записи будут видны только ему, так как храниться запись в локальном хранилище пользователя. Взглянув на скучный скрипт я решил его немного приукрасить. Сделал его в виде тетрадного листа. Итак давайте преступим к несложной установке.
Это вставляем в Ваш CSS:Код
.list {width:225px;}
.list .list_title {
text-align:center;
text-decoration:underline;
color: #6E4725;
font-family: "Lobster", cursive;
font-size: 20px;
line-height: 13px;
width:225px;
margin:0 0 10px 0;
padding-bottom:0px;
font-weight:normal;}
.list_t {
width:225px;
height:11px;
background:url('http://megascripts.ru/demo/shpargalka/list_t.png') no-repeat;}
.list_c {
width:225px;
background:url('http://megascripts.ru/demo/shpargalka/list_c.png') repeat-y;
padding:0px;}
.list_b {
width:225px;
height:11px;
background:url('http://megascripts.ru/demo/shpargalka/list_b.png') no-repeat;
margin-bottom:10px;}
.clear {clear:both;}
#shpora {
font-family: Segoe Print, Comic Sans MS, cursive;
width: 199px;
max-width: 199px;
min-width: 199px;
min-height: 100px;
max-height: 350px;
font-size: 14px;
padding-left:20px;
background: transparent;
border: 0px;}
Это сама разметка (вставляйте туда, где хотите видеть скрипт):
Код
<div class="list">
<div class="list_t"></div>
<div class="list_c">
<div class="list_title">Ваша шпаргалка</div>
<textarea id="shpora" onchange="savenote();"></textarea>
<div class="clear"></div>
</div>
<div class="list_b"></div>
</div>
<script type="text/javascript">
function savenote () {
localStorage.nerstanotes = document.getElementById('shpora').value;
}
if (localStorage) {
if (localStorage.nerstanotes) {
document.getElementById('shpora').value = localStorage.nerstanotes;
} else {
document.getElementById('shpora').value = 'Здесь можно писать любые ваши записи. Они будут видны только Вам.';
localStorage.nerstanotes = 'Здесь можно писать любые ваши записи. Они будут видны только Вам.';
}
} else {
document.getElementById('shpora').style.display = 'none';
}
</script>
