Скрипт всплывающей кнопки "наверх". Скрипт всплывающей кнопки "наверх" Кнопка плавной прокрутки вверх при помощи JQuery
Цель работы: Научиться создавать кнопки, изучить принцип их функционирования, научиться создавать различные элементы на кнопках.
Еще одно частое применение графических элементов - это оформление кнопок. Кнопка - это элемент взаимодействия с пользователем, так как предполагается, что когда он на нее нажмет, то что-нибудь произойдет.
Выделяют три типа кнопок:
· кнопки отправки : При активизации такой кнопки производится отправка формы. В форме может быть несколько кнопок отправки.
· кнопки сброса : При активизации такой кнопки для всех управляющих элементов устанавливаются исходные значения.
· прочие кнопки : Для таких кнопок действие по умолчанию не определено. С атрибутами событий каждой такой кнопки могут быть связаны клиентские скрипты. Если происходит событие (например, пользователь нажимает кнопку, отпускает ее и т.д.), включается связанный с событием скрипт.
Необходимо определять язык скрипта для кнопок в объявлении скрипта по умолчанию (в элементе META).
Кнопки создаются с помощью элемента BUTTON или INPUT. Э лемент BUTTON предоставляет более широкие возможности представления кнопки, чем элемент INPUT .
Чтобы создать кнопку, достаточно поместить некоторый текст между тегами , например, вот так:
Правда, из этого совершенно не следует, что при нажатии на этой кнопке что-нибудь произойдет.
Однако кнопка будет вполне полноценной и даже будет “вдавливаться” при нажатии.
Интереснее тот факт, что между тегами можно поместить не только текст, а все, что угодно. Если мы поместим туда тег , то получим кнопку с графическим изображением. Можно поместить на кнопку и текст, и изображение (только не надо забывать о форматировании - например, надо вставлять теги
для переноса строк и т.д.). Наконец, как показано в следующем примере, можно поместить на кнопку вообще любой блок HTML! В нашем примере мы поместили туда целую таблицу с разноцветными клетками.
Пример оформления кнопок:
TD {color: white;}
4.0
Она содержитТD> | целую таблицуТR> |
c разноцветнымиТD> | Клеточки |