Пример здесь!
Установка:
1. Ставим стили. Можно в CSS, можно прямо на страницу в теге <style>:
Code #panel1 {position:absolute;width:99%;height:23px;background:#79a0c1/*e6e6fa*/;cursor:pointer;}#panel1text {font-family: Tahoma;}#panel2 {display: none;width: 100%;height: auto;background:#e6e6fa;border:1px solid #79a0c1;font-family: Tahoma;} 2. Ставим скрипт, который будет делать эффект открытия/закрытия панели. В конец body:
Code <script type="text/javascript"> function ret(){ $('#panel2').fadeOut(); setTimeout("$('#panel1').fadeIn()", 500) } $('#panel1').click(function(){ $(this).fadeOut(), $('#panel2').slideToggle() }) $('#panel2').prepend('<div style="background:79a0c1;width:100%;height:23px"><a href="#" style="float:right;" onclick="ret()"><img src="http://vkurse.su/ajax/err.png" border="0" /></a></div><br />'); </script> 3. Ставим, собственно, саму панель:
Code <div id="panel2">jQuery — это JavaScript-фреймворк, предлагающий мощные инструменты для работы с DOM, AJAX и многим другим. Анимация, "общение" с сервером при помощи AJAX, выборка элементов по имени тега, атрибуту, индексу — на чистом JavaScript это заняло бы не одну страницу кода, но при помощи jQuery это можно сделать одной строчкой кода. Слоган jQuery — "Пиши меньше, делай больше" — говорит сам за себя.<br /> <a href="http://megasoft.3dn.ru/forum/13-142235" target="_blank">Читать дальше…</a> </div> <div id="panel1"> <center id="panel1text">jQuery</center> </div> Текст меняем на свой. Скрипт проверен в браузерах IE 7, Opera 10+, Mozilla Firefox 3 — всё работает корректно. Автор — $USERNAME$
Чтобы скачивать файлы зарегистрируйтесь, или войдите под своим логином ]
|
