Winner Вот отличное решение правда работает с ip а не с coocies.(чучуть поколдовать и будет норм)
Шаг 1. HTML Заметка
Шаг 2. CSS#pad{
position:relative;
width: 374px;
margin: 180px auto 40px;
}
#note{
font: normal 15px Courgette, cursive;
line-height: 17px;
color:#444;
background: url(../img/mid.png) repeat-y;
display: block;
border: none;
width: 329px;
min-height: 170px;
overflow: hidden;
resize: none;
outline: 0px;
padding: 0 10px 0 35px;
}
#pad h2{
background: url(../img/header.png) no-repeat;
overflow: hidden;
text-indent: -9999px;
height: 69px;
position: relative;
}
#pad:after{
position:absolute;
content:;
background:url(../img/footer.png) no-repeat;
width:100%;
height:40px;
}
Шаг 3. PHP$note_name = note.txt;
$uniqueNotePerIP = true;
if($uniqueNotePerIP){
// Используем адрес IP пользователя для именования файла заметки.
// Данная техника полезна в случаях, когда приложение
// используют несколько пользователей одновременно.
if(isset($_SERVER[HTTP_X_FORWARDED_FOR])){
$note_name = notes/.$_SERVER[HTTP_X_FORWARDED_FOR]..txt;
}
else{
$note_name = notes/.$_SERVER[REMOTE_ADDR]..txt;
}
}
if(isset($_SERVER[HTTP_X_REQUESTED_WITH])){
// Запрос AJAX
if(isset($_POST[note])){
// Записываем файл на диск
file_put_contents($note_name, $_POST[note]);
echo {saved:1};
}
exit;
}
$note_content = ;
if( file_exists($note_name) ){
$note_content = htmlspecialchars( file_get_contents($note_name) );
}
Шаг 4. jQuery$(function(){
var note = $(#note);
var saveTimer,
lineHeight = parseInt(note.css(line-height)),
minHeight = parseInt(note.css(min-height)),
lastHeight = minHeight,
newHeight = 0,
newLines = 0;
var countLinesRegex = new RegExp( ,g);
// Событие input запускается нажатием клавиш,
// копированием и даже операциями отмены/повторения.
note.on(input,function(e){
// Очистка таймера предотвращает
// сохранение каждого нажатия клавиш
clearTimeout(saveTimer);
saveTimer = setTimeout(ajaxSaveNote, 2000);
// Подсчет количества новых строк
newLines = note.val().match(countLinesRegex);
if(!newLines){
newLines = [];
}
// Увеличиваем высоту заметки (если нужно)
newHeight = Math.max((newLines.length + 1)*lineHeight, minHeight);
// Увеличиваем/уменьшаем высоту только один раз при изменеии
if(newHeight != lastHeight){
note.height(newHeight);
lastHeight = newHeight;
}
}).trigger(input); // Данная строка будет изменять размер заметки при загрузке страницы
function ajaxSaveNote(){
// Запускаем запрос AJAX POST для сохранения записи
$.post(index.php, { note : note.val() });
}
});
Файлики