studenti.rs home page

VISOKA ŠKOLA STRUKOVNIH STUDIJA 

ZA INFORMACIONE TEHNOLOGIJE

profesor strukovnih studija

dr um.

 Marko Nikolić, 

dipl. inž. arh.

NAPREDNI VEB DIZAJN

skripta

Beograd, 2015.

verzija 1.0

Sadržaj

1. HTML5 ...........................................................................................................10

1.1 Zaglavlje dokumenta i sintaksičke novine u HTML5 ...................................................11

1.2 Kratki pregled novina u HTML5 ...................................................................................12

1.2.1 Uklonjeni elementi i atributi ................................................................................12

1.2.2 Novi elementi u HTML5 ......................................................................................13

1.2.3 Novi tipovi ulaznih podataka u obrascima ...........................................................13

1.2.4 Novi globalni atributi ...........................................................................................13

1.2.5 Revizija značenjskih elemenata tekstualnog nivoa ..............................................14

1.3 HTML obrasci ................................................................................................................15

1.3.1 Element <form> ...................................................................................................15

1.3.2 Elementi <fieldset>, <legend> i <label> ..............................................................16

1.3.3 Element <input> ...................................................................................................17

1.3.3.1 Tip: 

text

 ...................................................................................................18

1.3.3.2 Tip: 

password

 ..........................................................................................19

1.3.3.3 Tipovi: 

email

, 

search

, 

url

, 

tel

 ..................................................................19

1.3.3.4 Tipovi: 

submit

 i 

reset

 ...............................................................................19

1.3.3.5 Tipovi: 

radio

 i 

checkbox

 .........................................................................19

1.3.3.6 Tip: 

file

 ....................................................................................................20

1.3.3.7 Tipovi: 

date

 i 

time

 ...................................................................................21

1.3.3.8 Tip: 

hidden

 ..............................................................................................21

1.3.3.9 Tip: 

number

 i 

range

 ................................................................................21

1.3.3.10 Tip: 

color

 .................................................................................................21

1.3.4 Element <textarea> ..............................................................................................22

1.3.5 Element <select> ..................................................................................................22

1.3.6 Element <datalist> ...............................................................................................23

1.3.7 Atributi: 

placeholder

, 

required

, 

autofocus

 i 

autocomplete

 ...................................24

1.4 Multimedijalni sadržaj ...................................................................................................25

1.4.1 Element <video> ..................................................................................................25

1.4.2 Element <audio> ..................................................................................................26

background image

2.2.2.2 Dodavanje SVG slike na 

inline

 način .....................................................48

2.2.3 Manipulacija SVG slike uz pomoć CSS-a ...........................................................49

2.2.3.1 Primeri stilizacija unutar SVG kȏda .......................................................49

2.2.3.2 Primer stilizacije izvan SVG kȏda ..........................................................50

2.3 Tranzicije .......................................................................................................................50

2.3.1 Vrednosti za funkciju vremena .............................................................................51

2.4 Transformacije ...............................................................................................................52

2.4.1 2D transformacije .................................................................................................52

2.4.1.1 Rotacija ...................................................................................................52

2.4.1.2 Skaliranje ................................................................................................53

2.4.1.3 Translacija ...............................................................................................53

2.4.1.4 Iskošavanje ..............................................................................................53

2.4.1.5 Transformacija 

matrix

 .............................................................................54

2.4.2 3D transformacije .................................................................................................54

2.5 Animacija .......................................................................................................................55

2.5.1 Definisanje CSS animacije ...................................................................................55

2.5.1.1 Pravilo 

@keyframes

 ................................................................................56

2.5.1.2 Svojstvo 

animation

 .................................................................................56

2.5.2 Primer upotrebe CSS animacije ...........................................................................58

2.5.3 Gotove CSS animacije .........................................................................................59

3. JavaScript .......................................................................................................60

3.1 Uvod ..............................................................................................................................61

3.1.1 Šta je skript? .........................................................................................................61

3.1.2 Upotreba skripta za HTML dokument .................................................................61

3.1.3 Kratka istorija JavaScript-a ..................................................................................62

3.2 Dodavanje JavaScript kȏda u HTML dokument ...........................................................62

3.2.1 Mesto dodavanja JavaScript kȏda ........................................................................62

3.2.2 Element <script> ..................................................................................................63

3.3 JavaScript sintaksa .........................................................................................................64

3.3.1 Pravila za pisanje identifikatora ...........................................................................64

3.3.2 Izjave ....................................................................................................................64

3.3.3 Ključne i rezervisane reči .....................................................................................65

3.3.4 Blokovi kȏda ........................................................................................................65

3.3.5 Velika i mala slova ...............................................................................................65

3.3.6 Komentari kȏda ....................................................................................................66

3.3.7 Lepo pisanje kȏda .................................................................................................66

3.4 Promenljive i tipovi podataka ........................................................................................66

3.4.1 Deklaracija promenljive .......................................................................................66

3.4.2 Primitivni tipovi podataka ....................................................................................67

3.4.2.1 Brojevi (

number

) .....................................................................................68

3.4.2.2 Znakovni niz (s

tring

) ..............................................................................69

3.4.2.3 Bulove vrednosti (

boolean

) .....................................................................70

3.4.2.4 Vrednosti

 undefined

 i 

null

 .......................................................................70

3.4.3 Neprimitivni tipovi podataka ...............................................................................71

3.4.4 Utvrđivanje tipa podatka ......................................................................................71

3.5 Funkcije (prvi deo) ........................................................................................................71

3.5.1 Deklarisanje funkcije ............................................................................................71

3.5.1.1 Parametri funkcije ...................................................................................72

3.5.1.2 Vraćanje vrednosti – naredba 

return

 .......................................................72

3.5.1.3 Anonimna funkcija ..................................................................................72

3.5.2 Izvršavanje funkcije .............................................................................................73

3.5.2.1 Samoizvršavajuća funkcija .....................................................................73

3.6 Kontrola toka programa .................................................................................................73

3.6.1 Odlučivanje ..........................................................................................................74

3.6.1.1 Uslovne naredbe i relacioni operatori .....................................................74

3.6.1.2 Prioritet operatora ...................................................................................74

3.6.1.3 Logički operatori .....................................................................................75

3.6.1.4 Rezime operatora ....................................................................................75

3.6.1.5 Struktura 

if

 i 

else

 

if

 ..................................................................................76

3.6.1.6

Switch

 struktura .......................................................................................76

3.6.1.7 Ternarni operator .....................................................................................78

3.6.2 Petlje .....................................................................................................................78

3.6.2.1

For

 petlja .................................................................................................78

3.6.2.2

While

 petlja .............................................................................................79

3.6.2.3

Do

-

while

 petlja ........................................................................................80

background image

3.9.3.4 Osnovni rad sa DOM čvorovima ..........................................................101

3.9.3.5 Modifikovanje stila DOM elemenata ....................................................103

3.10  Događaji ......................................................................................................................104

3.10.1 Vrste događaja ...................................................................................................104

3.10.1.1 Događaji koji se odnose na miša ...........................................................105

3.10.1.2 Događaji koji se odnose na tastaturu .....................................................105

3.10.1.3 Događaji dokumenta .............................................................................105

3.10.2 Implementacija rukovaoca događajima .............................................................106

3.10.2.1 Označavanje rukovaoca događajima pomoću HTML atributa .............106

3.10.2.2 Označavanje rukovaoca događajima na DOM 

level 0

 način ................107

3.10.2.3 Označavanje rukovaoca događajima na DOM

 level 2

 način ................108

3.10.2.4 Pisanje rukovalaca događajima koji se izvršavaju u više čitača ...........109

3.10.3 Objekat 

Event

 ....................................................................................................110

3.10.3.1 Objekat 

MouseEvent

 .............................................................................111

3.11 Tajmeri .........................................................................................................................112

3.11.1  Definisanje kašnjenja ........................................................................................112

3.11.2  Definisanje intervala ..........................................................................................112

3.12  Rad sa medijskim HTML elementima ........................................................................113

3.12.1 Metodi 

HTMLMediaElement

-a .........................................................................113

3.12.2 Svojstva 

HTMLMediaElement

-a .......................................................................114

3.12.3 Događaji koje aktivira 

HTMLMediaElement

 ....................................................114

3.13  Uvod u 

jQuery

 ............................................................................................................115

3.13.1 Uključivanje biblioteke u HTML dokument .....................................................115

3.13.2 

jQuery

 selektor ..................................................................................................116

3.13.3 

jQuery

 i DOM ...................................................................................................117

3.13.3.1 Kreiranje novih HTML elemenata ........................................................117

3.13.3.2 Uklanjanje HTML elemenata ................................................................117

3.13.3.3 Rad sa sadržajem HTML elmenata .......................................................118

3.13.3.4 Rad sa atributima ...................................................................................118

3.13.3.5 Rad sa stilovima ....................................................................................118

3.13.4 

jQuery

 događaji .................................................................................................119

3.13.4.1 Provera učitanosti strane .......................................................................119

3.13.4.2 Kratki spisak događaja koje 

jQuery

 registruje ......................................119

Želiš da pročitaš svih 124 strana?

Prijavi se i preuzmi ceo dokument.

Prijavi se Napravi nalog

Ovaj materijal je namenjen za učenje i pripremu, ne za predaju.

Slični dokumenti