spis treści - Kurs HTML i CSS
Galeria zdjęć HTML / Skrypt galerii zdjęćSpis treści Wymagana wiedza Przykład galerii zdjęć Skrypt galerii zdjęć (gotowiec) Zbiory zdjęć Ochrona przed kopiowaniem zdjęć Wymagana wiedza Konstruowanie ścieżek dostępu do obrazków Przykład galerii zdjęć Kliknij wybrane zdjęcie lewym przyciskiem myszki, aby zobaczyć powiększenie: Zwróć uwagę, że po otworzeniu powiększenia możesz nawigować pomiędzy kolejnymi zdjęciami z galerii również za pomocą klawiatury - klawiszami strzałki w lewo (poprzednie zdjęcie) i w prawo...
- Przeglądarka zdjęć
Spis treści Wymagana wiedza Przykład przeglądarki zdjęć Skrypt przeglądarki zdjęć Inicjalizacja Wymagana wiedza Konstruowanie ścieżek dostępu do obrazków Podstawy stylów CSS (m.in. arkusze stylów) Odsyłacze do podstrony Przykład przeglądarki zdjęć Skrypt przeglądarki zdjęć Aby uzyskać powyższy efekt, należy zapisać przedstawiony poniżej kod w dowolnym pliku z rozszerzeniem *.js - np. przegladarka_zdjec.js: /** * @author Sławomir Kokłowski {@link https://www.kurshtml.edu.pl}...
- Indeks, wyszukiwarka / Skrypt indeksu, wyszukiwarki
Spis treści Wymagana wiedza Skrypt indeksu, wyszukiwarki Wieloznacznik (wildcard) Wymagana wiedza Odsyłacze do podstrony Wczytywanie stron do ramki lokalnej Podstawy stylów CSS (m.in. arkusze stylów) Skrypt indeksu, wyszukiwarki Aby wstawić na swoją stronę indeks z dodatkową funkcją wyszukiwarki, postępują według poniższych instrukcji: Utwórz w swoim edytorze HTML nowy dokument. Wklej do niego poniższy kod i zapisz w pliku indeks.js (koniecznie użyj kodowania utf-8)...
- Menu rozwijane, otwierane, wysuwane / Skrypt menu rozwijanego, otwieranego, wysuwanego
Spis treści Wymagana wiedza Skrypt menu rozwijanego, otwieranego, wysuwanego Wymagana wiedza Listy definicyjne <dl>...</dl> Podstawy odsyłaczy Podstawy stylów CSS (m.in. arkusze stylów, klasy selektorów i pozycjonowanie absolutne) Skrypt menu rozwijanego, otwieranego, wysuwanego Aby wstawić na swoją stronę menu rozwijane, postępuj według poniższych instrukcji: Utwórz w swoim edytorze HTML nowy dokument. Wklej do niego poniższy kod i zapisz w pliku menu.js: /** * @author...
Odsyłacze HTML / Do etykiety <a id>...Można również nadać atrybut id="nazwa-kotwicy" dowolnemu istniejącemu już znacznikowi - np. wybranemu tytułowi nagłówkowemu tworząc w ten sposób spis treści dokumentu: <h1 id="tytul-rozdzialu">...</h1>. Ile może być identycznych etykiet w jednym pliku? W tym samym dokumencie HTML można wstawić dowolną liczbę etykiet, ale każda z nich musi mieć inną nazwę. W przeciwnym razie przeglądarka nie wiedziałaby, do której z nich przenieść użytkownika po kliknięciu w odnośnik zawierający taką...
Obsługa błędów w JavaScript - Error / Błąd wykonania - EvalErrorSpis treści EvalError EvalError EvalError.prototype.name EvalError EvalError() new EvalError() EvalError(message) new EvalError(message) Parametry: String message - komunikat błędu (domyślnie: "") Wartość: EvalError - nowa instancja obiektu błędu Ta klasa dziedziczy po Error. EvalError.prototype.name EvalError.prototype.name Wartość: String - "EvalError" Przykład EvalError EvalError.prototype.name; // "EvalError" EvalError("test").toString(); // "EvalError: test" new...
- Odsyłacze HTML / Inne <a "news, nntp, newsrc, telnet, ssh, javascript, wais, gopher">
Spis treści <a "news, nntp, newsrc, telnet, ssh, javascript, wais, gopher"> Odsyłacz do grup dyskusyjnych <a "news"> Odsyłacz NNTP <a "nntp"> Odsyłacz newsrc <a "newsrc"> Odsyłacz telnet <a "telnet"> Odsyłacz SSH <a "ssh"> Odsyłacz do skryptu <a "javascript"> Odsyłacz WAIS <a "wais"> Odsyłacz Gopher <a "gopher"> Odsyłacz do grup dyskusyjnych <a "news"> Serwer domyślny: <a href="news:nazwa grupy">opis</a> Wskazany serwer: <a href="news://serwer/">opis</a> Wskazana grupa na...
Odsyłacze HTML / ĆwiczeniaOtwórz w edytorze HTML stronę (plik index.html) stworzoną w ramach ćwiczeń z poprzedniego rozdziału. Utwórz spis treści dodając etykiety do tytułów poszczególnych sekcji tematycznych na stronie głównej, a następnie umieszczając na początku wykaz z listą odsyłaczy do tych etykiet. Przygotuj po dwie wersje ilustracji z Twojej strony. Pierwsza powinna mieć rozmiary dokładnie takie jak widoczne bezpośrednio na stronie. Natomiast druga wersja może być zdjęciem w wysokiej rozdzielczości. W tym celu...
- Odsyłacze HTML / Mapa odsyłaczy <img usemap, map, area>
Spis treści <img usemap, map, area> Mapa odsyłaczy <img usemap, map, area> Nakładanie obszarów Mapa odsyłaczy <img usemap, map, area> <img src="ścieżka dostępu do obrazka" alt="tekst alternatywny" usemap="#nazwa_mapy"> <map id="nazwa_mapy" name="nazwa_mapy"> <area shape="kształt" coords="współrzędne" href="adres" alt="tekst alternatywny"> <area shape="kształt" coords="współrzędne" href="adres" alt="tekst alternatywny"> (...) </map> ścieżka dostępu do obrazka Lokalizacja na dysku...
- Tabele HTML / Łączenie wierszy tabeli w grupy <thead, tbody, tfoot>
Spis treści <thead, tbody, tfoot> Łączenie wierszy tabeli w grupy <tbody> Nagłówek i stopka <thead, tfoot> Łączenie wierszy tabeli w grupy <tbody> <table> <tbody> <tr>...</tr> </tbody> </table> Łączenie wierszy w grupy umożliwia później odnoszenie się do takiej grupy jako do całości. Dzięki temu możemy nadać od razu całej grupie np. określone formatowanie za pomocą CSS. W grupę można połączyć dowolną liczbę wierszy. W jednej tabeli może istnieć kilka grup. Jeżeli umieścimy w...