Делаем слайдер вручную
 Скачать 1.24 Mb.
|
|
Делаем слайдер вручную Слайдер - это средство отображения изображений в виде слайдов. Обычно слайдеры имеют возможность как автоматического слайд-шоу (когда слайды показываются автоматически), так и ручного переключения слайдов. Код простейшего слайдера довольно компактный. Нам нужно предусмотреть массив с изображениями, функции инициализации слайдера, функции прокрутки слайдера влево и вправо, а также автоматическое перелистывание картинок. Подготовка: Создайте отдельную папку MySlider, в ней создайте файлы slider.html и style.css, а также поместите несколько картинок – по теме своего курсового. Поместите следующий код в файл slider.html: Перечислите свои картинки Поместите в файл style.css следующие стили: РЕЗУЛЬТАТ: Делаем меню вручную Меню - очень важный элемент любого сайта, и от того, как оно устроено (и как продумано), во многом зависит, найдет ли пользователь необходимый материал на сайте и как комфортно ему будет работать с вашим сайтом. Конечно, необходимый материал можно найти через поисковик, но в этом случае пользователь увидит много сайтов ваших конкурентов, и если один из них будет более удобным в использовании, чем ваш, не думаю, что у пользователя возникнет желание вернуться на ваш сайт. Статические меню уже давно канули в прошлое. Они неудобны, и при выборе пункта меню, чтобы появились дочерние элементы меню, приходится ждать перезагрузки страницы. Во-первых, это время ожидания для пользователя. А если соединение медленное или сервер слишком загружен, ждать приходится несколько секунд, что очень раздражает. Во-вторых, как ни крути, каждый такой запрос - лишняя нагрузка на сервер. Допустим, на сайт зашло 1000 пользователей и выбрало один из пунктов меню, чтобы увидеть команды меню, в итоге, была создана лишняя тысяча запросов, которых можно было бы избежать. Создать динамическое меню, оказывается, очень просто. Принцип следующий. В НТМL-коде мы формируем блоки. Каждый блок будет представлять собой отдельный пункт меню или подменю. Блоки мы будем формировать с помощью таблиц. У нас будет одна таблица для пунктов главного меню, а также отдельные таблицы для каждого подменю. Строки таблицы будут пунктами данного подменю. Подготовка: Создайте отдельную папку MyMenu, в ней создайте файлы menu.html и style.css. Поместите следующий код в файл menu.html: Поместите в файл style.css следующие стили: РЕЗУЛЬТАТ: Самостоятельно: Определить меню для своего сайта и его оформление! |