Zadanie 1.

Prosta modyfikacja DOM. Stwórz 4 divy w HTML oraz 4 przyciski. Do przycisków dodaj następujące działanie:

przycisk 1 – doda kolejny div do 4 istniejących divów

przycisk 2 – usunie pierwszy div (kolejne naciśnięcie usunie kolejny div i tak dalej)

przycisk 3 – zmieni kolor tła diva numer 3

przycisk 4 – wpisze tekst „nowy tekst” do wszystkich divów

doda kolejny div

usunie pierwszy div

zmieni kolor tła diva numer 3

wpisze tekst „nowy tekst” do wszystkich divów

wpisze tekst „div X” do wszystkich divów

Divy do zabawy:

Zadanie 2. - Zadanie 10. ze zjazdu 4 + tabelka z autami

Poniższe pola reprezentują akutalny stan obiektu z treści zadania.

Ich zawartość będzie wpływać na resultaty funkcji z podpunktów a-d oraz będzie się zmieniać pod wpływem działania tych funkcji.

Auto:

rok:

przebieg:

cena wyjściowa:

cena końcowa:

a) Funkcja, która powiększa cenę wyjściową o 1000

b) Funkcja, która obniża cenę końcową o 1000 za każdy rok wieku auta (względem ceny wyjściowej)

c) Funkcja, która obniża cenę końcową o 10000 za każde 100000km przebiegu auta

d) Funkcja, która dopisuje do auta podany przebieg i rok (automatycznie przeliczając cenę wg powyższych funkcji)

e) Funkcja, która dopisze auto do tablicy samochodow, jesli jego cena jest wieksza niz 10000

f) Funkcja, ktora operuje na tablicy obiektow typu auto. Dla wszystkich aut z tablicy zwieksza rok o 1

Auta:

Wyczyść tabelę

Zadanie 3.

Do strony www z zajęć o CSS dodaj responsywność: menu główne na małych ekranach powinno być zwinięte do „hamburgera” (bez używania gotowych bibliotek).

Rozwiązanie: link

Zadanie 4.

Przy pomocy HTML, CSS, JS zbuduj akordeon(przykład: https://jqueryui.com/accordion/)bez używania gotowych bibliotek

Akordeon:

Sekcja 1

Lorem ipsum dolor sit amet consectetur adipisicing elit. Nesciunt consectetur id necessitatibus culpa porro nam, voluptatum suscipit molestias expedita itaque reiciendis recusandae deserunt vitae! Nesciunt animi deleniti cumque a in.

Sekcja 2

Sekcja 3

Sekcja 4

Zadanie 5.

Przy pomocy HTML, CSS, JS zbuduj galerię zdjęć typu Lightbox(przykład: http://brutaldesign.github.io/swipebox/) bez używania gotowych bibliotek