Skip to content

Instantly share code, notes, and snippets.

@Spoygg

Spoygg/zadatak-za-vladu.txt

Last active August 29, 2015 14:16
Show Gist options
  • Save Spoygg/3af99992330531f0e522 to your computer and use it in GitHub Desktop.
Save Spoygg/3af99992330531f0e522 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
zadatak-za-vladu.txt
projekat
|-- partials
| |-- header.php
| +-- footer.php
|
|-- index.php
|-- gallery.php
|-- about.php
|-- founders.php
|
|-- js
| +-- script.js
|
|-- css
+-- style.css
Evo ovako treba da izgleda struktura projekta
Sve što nema ekstenziju je folder. Znači u glavnom folderu
"projekat" imaš foldere: "partials", "js" i "css" i u njima
fajlove.
index.php, gallery.php, founders.php i about.php su stranice. Sve stranice koriste
isto zaglavlje i podnožje tj. header i footer. Zaglavlje i podnožje definiši
u partials fajlovima i include-uj ih u ostalim fajlovima.
header.php će sadržati nešto poput:
=================================================
<html>
<head>
...
</head>
<body>
<nav>...</nav>
...
=================================================
footer.php:
=================================================
...
<div class="copyright">© Vlada 2015.</div>
</body>
</html>
=================================================
U footer ubaci copyright notice koji sadrži sadašnju godinu, ovo možeš php-om.
Meni
====
Sajt treba da sadrži meni u zaglavlju koji će izgledati ovako (ne mislim na dizajn nego na strukturu):
+------+---------+-------+
| Home | Gallery | About |
+------+---------+-------+--+
| Founders |
+----------+
Dakle imaš tri glavna item-a i kad staviš miša na About izađe ti Founders item.
Index
=====
Na index strani ubaci samo neki tekst i dve slike da ide ovako:
+-------------+ ovde ide tekst između slika +-------------+
| | ovde ide tekst između slika | |
| | ovde ide tekst između slika | |
| | ovde ide tekst između slika | |
+-------------+ ovde ide tekst između slika +-------------+
Znači levo i desno imaš sliku a između tekst :)
Gallery
=======
Na gallery strani složi 12 slika u 3x4 formi:
+-------------+ +-------------+ +-------------+ +-------------+
| | | | | | | |
| | | | | | | |
| | | | | | | |
+-------------+ +-------------+ +-------------+ +-------------+
Slika 1 Slika 2 Slika 3 Slika 4
+-------------+ +-------------+ +-------------+ +-------------+
| | | | | | | |
| | | | | | | |
| | | | | | | |
+-------------+ +-------------+ +-------------+ +-------------+
Slika 5 Slika 6 Slika 7 Slika 8
+-------------+ +-------------+ +-------------+ +-------------+
| | | | | | | |
| | | | | | | |
| | | | | | | |
+-------------+ +-------------+ +-------------+ +-------------+
Slika 9 Slika 10 Slika 11 Slika 12
About
=====
Ovde ubaci slider sa tri slajda koji se smenjuju na 5 sekundi i mogu da se promene i klikom na strelice ovako:
+----------------------------------------------------+
| |
| |
| |
+-----+ | | +-----+
| <-- | | | | --> |
+-----+ | | +-----+
| |
| |
| |
+----------------------------------------------------+
Kada klikneš na strelicu slajd če sačekati 5 sekudi pre nego što se učita sledeći, znači ako si na 3 sekunde nakon promene slajda i
klikneš na strelicu proće još 5 sekundi pre nego što se promeni na sledeću sliku.
Kad staviš miša na slajd (znači sliku) smenjivanje slajdova staje dok ne pomeriš miša.
Founders
========
Ovde ubaci informacije o 6 osnivača da izgleda ovako:
Ime Osnivača Ime Osnivača Ime Osnivača
+-------------+ ovde ide tekst +-------------+ ovde ide tekst +-------------+ ovde ide tekst
| | ovde ide tekst | | ovde ide tekst | | ovde ide tekst
| | ovde ide tekst | | ovde ide tekst | | ovde ide tekst
| | ovde ide tekst | | ovde ide tekst | | ovde ide tekst
+-------------+ ovde ide tekst +-------------+ ovde ide tekst +-------------+ ovde ide tekst
ovde ide tekst ovde ide tekst i ovde ide tekst ovde ide tekst.
ovde ide tekst ovde ide tekst.
Ime Osnivača Ime Osnivača Ime Osnivača
+-------------+ ovde ide tekst +-------------+ ovde ide tekst +-------------+ ovde ide tekst
| | ovde ide tekst | | ovde ide tekst | | ovde ide tekst
| | ovde ide tekst | | ovde ide tekst | | ovde ide tekst
| | ovde ide tekst | | ovde ide tekst | | ovde ide tekst
+-------------+ ovde ide tekst +-------------+ ovde ide tekst +-------------+ ovde ide tekst
Primetićeš da u prvom redu imaš dva teksta koji su duži i idu ispod slike, napravi to tako. Drugi red
ne sme da se poremeti zbog toga, tj. ime osnivača za svaku sliku mora biti u istoj visini.
JavaScript
==========
Slajder kod napiši sam, možeš koristiti http://jquery.com/ kao jedini library jer je lakše manipulisati
elementima na strani. Sve ostalo u vezi slajdera napiši sam. I sav js kod stavi u script.js
CSS
===
Sav css stavi u style.css, funckonalnost menija da se otvori dodatna stavka ispod about uradi CSS-om ne js-om.
HTML
====
Nipošto ne koristi <table> element za slaganje stvari na strani, <table> se koristi iskljčivo za prikazivanje
tabularnih podataka. Još jednom da ponovim na ovom sajtu nemaš nigde potrebu da koristiš <table>.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment