Знакомство с css



Download 0,88 Mb.
bet45/46
Sana15.04.2022
Hajmi0,88 Mb.
#552991
TuriТесты
1   ...   38   39   40   41   42   43   44   45   46
Bog'liq
ТЕКСТ ЛЕКЦИИ ВЕБ нью

Пример:

Код HTML:


Наведите мышь на ячейку:


Part 1

Part 2

Part 3

Part 4



 
... 
 
 
 class="green" onMouseOver="this.className=‘dark’" 
onMouseOut="this.className=‘green’"> 
Part 1 
 
 
... 



Попробуйте сделать самостоятельно:


Сервер

Web

Photoshop

Poser

Corel Draw



Все элементы этого примера имеют работающие ссылки другие документы. Используя Java-script создайте подобное «меню» самостоятельно.

Методы Apply, Play, Stop. Фильтр переходов RevealTrans


Фильтр RevealTrans может быть применен к любому объекту, показывая или пряча его, при этом используются различные техники.
Синтаксис: .




Duration




Время перехода из одного состояния в другое. Формат записисекунды.миллисекунды Например 2.1 = 2 секунды, 100 миллисекунд.




Transition




Переход. Может быть следующим (названия оставлю на английском что бы не портить художественный замысел авторов...):

Значение




Описание

0




Box in

1




Box out

2




Circle in

3




Circle out

4




Wipe up

5




Wipe down

6




Wipe right

7




Wipe left

8




Verical blins

9




Horizontal blinds

10




Checkerboard across

11




Checkerboard down

12




Random dissolve

13




Split vertical in

14




Split vertical out

15




Spli horizontal in

16




Split horizontal out

17




Strips left down

18




Strips left up

19




Strips right down

20




Strips right up

21




Random bars horizontal

22




Random bars vertical

23




Произвольный эффект (любой из 23)






Внимание: Фильтр RevealTransition лучше применять со следующими методами DHTML:






Apply




используется, чтобы фактически применить фильтр




Play




используется, чтобы фактически запустить фильтр




Stop




используется что бы остановить применение фильтра, и может быть вызван в любое время когда фильтр запущен



Пример 12.1 иллюстрирует применение визуальных фильтров в DHTML на практике.


Использование визуальных фильтров в DHTML
В примере показано, как при помощи визуального фильтра RevealTrans можно создавать различные эффекты переходов между изибражениями с помощью функции, написанной на java-script.

Внимание!!! Пример корректно работает только в браузере MS Internet Explorer.


Пример:

Код HTML:


«Кликните» на ссылках:

Извлечь картинку




Спрятать картинку

 href="#none" onClick="FilterOn()"> 
Извлечь картинку 
 
 id="logo" src="img/Crow.gif" width="73" height="59" border="0" 
style="filter:revealTrans(Duration=3.0, Transition=12); VISIBILITY:hidden" 
> 
 href="#none" onClick="FilterOut()"> 
Спрятать картинку

Функция FilterOn( ) написана на Java-Script:


function FilterOn(){ 
logo.filters.item(0).Apply(); 
logo.style.visibility=""; 
logo.filters.item(0).Play();

Функцию FilterOut( ) допишите самостоятельно:


function FilterOut(){ 
. . . 




Попробуйте сделать самостоятельно:

Создайте разные варианты переходов:



Наведите мышку на название страны... 

Австрия

Болгария

Канада

Китай









Куба

Чехия

Египет

Эстония









Франция

Германия

Греция

Индия









Израиль

Япония

Лесото

Либерия









Монако

Монголия

Перу

Россия









Швеция

Великобританя

США










Наведите мышку на фотографию... 


Объект Window. Метод open. Событие onClick


Объект Window представляет собой открытое окно web-браузера, является наивысшим объеком в иерархии JavaScript.
Метод open используется для определения окна, создания нового документа или экземпляра окна. 
Синтаксис: winVar = window.open ("URL", "winName" [, "winFeatures"]), где 
winVar – имя нового окна, 
winName – имя окна, которое используется в атрибуте target тегов 
или 
winFeatures – отделяемый запятой список параметров.
Событие onClick вызывает обработчик событий после щелчка левой кнопки мыши на объекте.
Пример 13.1 приведен пример программы управления окном браузера.
Пример программы управления окнами web-браузера на языке JavaScript
Внутри контейнера скрипта определены две функции пользователя: CallWeb() и CallShop().Обе функции используют один и тот же метод open (встроенную в JavaScriptфункцию,которая определена над объектом window) для того, чтобы открыть новое окно браузера и загрузить в него гипертекстовые документы. При этом функция CallShop()порождает стандартное окно (с кнопочками, иконками и т. п.), а функция CallWeb() окно без стандартных атрибутов. У этого окна имеются только линейки прокрутки (scrollbars).
Вызов функций осуществляется после нажатия на соответствующую кнопку, которые определены в HTML-форме с именем forma.Таким образом, выполнение функций будет осуществлено только в том случае, если произойдет событие, описанное атрибутом  соответствующего поля формы.

Пример:

Код HTML:


Нажмите на кнопочки:

Начало формы


Эта кнопка вызывает окно без атрибутов 

Эта кнопка вызывает стандартное окно 


Конец формы


Функция FilterOn( ) написана на Java-Script:


function CallWeb(){ 
WebD = window.open("http://www.modern-computer.ru/practice/web-design/prcatic-web-design-main.html", "WebD", "scrollbars=yes, resizable=yes, contextbar=no"); 


function CallShop(){ 
Shop = window.open("http://www.modern-computer.ru/practice/photoshop/photoshop-main.html", "shop"); 

Коллекция тегов images. Атрибут src


Коллекция – это массив объектов, проиндексированный по их именам, и имеющий свойства и методы, т. е. коллекция сама по себе – объект.
Коллекция images содержит объекты, построенные браузером для всех картинок, задаваемых в документе тегами .
Атрибут src определяет URI используемого изображения.
Синтаксис:
document.images[n].src 
где n - порядковый номер изображения в коллекции

Пример 14.1 иллюстрирует способ доступа к свойству src изображения, заданного тегом .


Функция доступа к свойству src объектов коллекции тегов images на языке JavaScript
В данном примере при выборе гипертекстовой ссылки происходит вызов функции LoadImg(), которая изменяет значение атрибута src в контейнере . Таким образом, можно организовать просмотр различных изображение в одном единственном графическом окне.

Пример:

Код HTML:


Только у нас вы можете взять на прокат следующие виды транспорта:

  • Дирижабль

  • Вертолёт

  • Самолёт

  • Лодка

  • Катер

  • Автомобиль





 href="javascript:LoadImg('img/1.gif')"> 
Дирижабль 
 
. . . и т. д.

Функция LoadImg( ) написана на Java-Script:


function LoadImg(a) { 
document.images[0].src=a; 
}


Учебный план

Рабочая программа




Download 0,88 Mb.

Do'stlaringiz bilan baham:
1   ...   38   39   40   41   42   43   44   45   46




Ma'lumotlar bazasi mualliflik huquqi bilan himoyalangan ©hozir.org 2024
ma'muriyatiga murojaat qiling

kiriting | ro'yxatdan o'tish
    Bosh sahifa
юртда тантана
Боғда битган
Бугун юртда
Эшитганлар жилманглар
Эшитмадим деманглар
битган бодомлар
Yangiariq tumani
qitish marakazi
Raqamli texnologiyalar
ilishida muhokamadan
tasdiqqa tavsiya
tavsiya etilgan
iqtisodiyot kafedrasi
steiermarkischen landesregierung
asarlaringizni yuboring
o'zingizning asarlaringizni
Iltimos faqat
faqat o'zingizning
steierm rkischen
landesregierung fachabteilung
rkischen landesregierung
hamshira loyihasi
loyihasi mavsum
faolyatining oqibatlari
asosiy adabiyotlar
fakulteti ahborot
ahborot havfsizligi
havfsizligi kafedrasi
fanidan bo’yicha
fakulteti iqtisodiyot
boshqaruv fakulteti
chiqarishda boshqaruv
ishlab chiqarishda
iqtisodiyot fakultet
multiservis tarmoqlari
fanidan asosiy
Uzbek fanidan
mavzulari potok
asosidagi multiservis
'aliyyil a'ziym
billahil 'aliyyil
illaa billahil
quvvata illaa
falah' deganida
Kompyuter savodxonligi
bo’yicha mustaqil
'alal falah'
Hayya 'alal
'alas soloh
Hayya 'alas
mavsum boyicha


yuklab olish