Witam wszystkich!
Dzisiejszym tematem będzie budowanie własnego zeszytu w postaci elektronicznej .
Przykładowy zeszyt można zobaczyć pod adresem: Przyklad
Każde zadanie robione na lekcji będzie umieszczane w menu z lewej strony i otwierane w oknie obok.
Zasada działania jest bardzo prosta:
-stworzenie szkieletu strony
-pobranie zadań z bazy danych
-wypisanie zadań w menu
-otwieranie danego zadania w oknie obok
Uwaga! Baza danych powinna zawierać takie pola jak: ID (klucz), nazwa (nazwa strony np. zadanie.inc.php), opis (pole widocznie w menu)
Kod pliku index.php :
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 | <html> <head> <link rel="stylesheet" href="config/style.css" type="text/css"> <!-- deklaracja stylu --> </head> <div id="kontener"> <!-- Polecenie DIV określający wielkość i szerokość szkieletu --> <div id="naglowek"><img src="obrazek.gif"></div> <div class="menu" id="k1"> <ul> <?php include"config/polacz.php"; //polecenie include służące do połączenia z bazą danych $tabela=mysql_query("Select * FROM zeszyt ORDER BY ID;"); //Pobranie danych z tabeli zeszyt while($wiersz=mysql_fetch_row($tabela)) { echo "<li><a href="index.php?plik=$wiersz[1]">$wiersz[2]</a></li>"; //Wypisanie linków w MENU z bazy } mysql_free_result($tabela); mysql_close($link); ?> </ul> </div> <div class="kolumna" id="k2"> <?php if (!isset($_GET['plik']) || ($_GET['plik']=="")) //zabezpieczenie które otworzy plik newsy.inc.php w razie błędu { $plik="newsy.inc.php"; include"$plik"; } else { $plik=$_GET['plik']; include"zadania/$plik"; //Otwarcie danej strony w oknie obok menu } ?> </div> <div id="clear"></div> <div id="stopka"><img src="stopka.gif"></div> </div> </body></html> |
Kod programu style.css
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 | #kontener{ width: 960px; margin: 0 auto; } #naglowek{ margin: 10px; width: 930px; height: 190px; border: 2px solid black; } .menu{ margin-left: 10px; width: 120px; height:350px; float:left; border:2px solid black; } .kolumna{ float: left; width: 810px; height: 350px; border: 2px solid black; } #clear{ clear: both; } #stopka{ margin: 10px; width: 930px; height: 250px; border: 2px solid black; } |