Анимация на сайта

Предишен ◈ Следващото

Не, в Photoshop, ние ще се справим, продължавай около добрия стар HTML и се научите да правите няколко трика за анимация.

Мисля, че много уебмастъри просто не знаят за съществуването на специален маркер, който движи текста и съживява с изображения.







Много неща могат да бъдат анимирани без използването на Photoshop, с помощта на конвенционални HTML, но всички ни позволяват в ред. Да вървим!

Как онлайн видеоигра, използвайки HTML

Така че, да се запознаете! Магията маркер - . Първоначално този етикет е разработен за Internet Explorer, но с течение на времето и други браузъри започнаха да подкрепят неговото прилагане.

Невероятно, но ред започна да се движи. Сега нека да се направи линия малко по-забележима, добавяйки стилове.

Прилагането на стойност правилната посока атрибут променим посоката на движение на работа линия и тя ще се премести от дясно на ляво:

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

Заместването на стойност за атрибута посока правим линия движение отдолу нагоре:

Стойност показва надолу линия се движи надолу

Мисля, че е необходимо да се увеличи скоростта на превъртане махало, за това ние използваме scrollamount атрибут. Цифрата в скобите показва броя от 1. Например:

Сега, нека да спрем и да видим как маркерът .

Анимация се дължи на постоянното триене на информация и да я покаже на ново място. Като се използват стойностите за атрибута ние да зададете разстоянието в пиксели между изтрива и новата позиция на линиите, като по този начин влияе на скоростта и плавността на движението му.







За мълчанието е на стойност на стойност 6, но ако е зададено на 1, разстоянието между старата и новата позиция на линиите ще бъде един пиксел, което осигурява бавно и гладко протичане махало:

Умение уточнява как поведението на превъртане в рамките на предварително определен блок и има стойност по подразбиране превъртане а. което прави управление някъде да се скрие от погледа и започнат да се движат отново.

Но ако се замени редуват стойност. линията, няма да бъдат скрити от погледа, но когато дойде в границите на блока започва да се движи в обратна посока:

Стойността на атрибута поведение пързалка инструктира пътуване линия, за да се достигне границата на блок и да се спре:

Ръст атрибут определя височината на блока. По подразбиране е 12 пиксела, но нека да го промените и да добавите малко на скоростта на превъртане махало:

Умение ширина отговорен за блок ширина. Можете да използвате ширина и височина атрибути заедно, за да настроите желаната граница блок. За да добавите яснота за стилове на рамката и леко се забави скоростта на превъртане:

Сега нека да попитам за палатка заден план. За да направите това, ние прилагаме най BGCOLOR атрибут и сложи на него жълт цвят на фона:

Сега нека да се опитаме да направим управление по линията се движат в различни посоки.

Ticker Ticker

Задайте закъснение анимация използване scrolldelay атрибут. Заместването на числени стойности. По подразбиране е 80 милисекунди:

Умение scrolldelay - е друг инструмент, с който можем да регулирате скоростта на превъртане.

Изображение Анимация Online

Един прост пример на анимирани изображения:

Самият курс е анимирани изображения в Photoshop, но ние сме принудени да се придвижват в страницата, създавайки ефект на движение.

Ето един интересен пример на шатрата на етикет, можете да създадете един прост слайдер:

Може ли всяка снимка в плъзгача, за да се направи справка:

С отношение Виталий Кирилов







Предишен ◈ Следващото