javascript - Kurs HTML i CSS
Aktualizacja / Data aktualizacji stronySpis treści Data aktualizacji strony Aktualna data Data aktualizacji strony Często zdarza się, że internauta wchodzący na jakąś stronę, chciałby wiedzieć, kiedy była ona ostatnio aktualizowana. Dzięki takiej informacji mógłby wywnioskować, czy serwis jest aktualizowany na bieżąco i czy nie znajdzie w nim informacji, które dawno utraciły ważność, co w niektórych przypadkach może być bardzo ważne. Najprostszym sposobem określenia aktualności strony, jest podanie w widocznym miejscu (np...
Formularze HTML / Przycisk <button><button type="rodzaj">Treść przycisku</button> gdzie "rodzaj" określa typ przycisku i można tutaj podać: "submit" - przycisk wysłania formularza (domyślnie) "reset" - przycisk wyczyszczenia danych "button" - zwykły przycisk Wprowadza na ekran przycisk. Polecenie to jest zbliżone do przycisków: wysłania oraz wyczyszczenia formularza, a także do: <input type="button" value="napis">. Jednak pozwala ono dodatkowo, wprowadzić do przycisku grafikę, tabelkę i inne elementy - wystarczy umieścić...
- Indeks, wyszukiwarka / Skrypt indeksu, wyszukiwarki
...(i < hasla.length - 1 ? ",\n" : "")); } document.write("</pre>"); } else { document.write( '<form id="' + this.id + '" action="javascript:void(0)" onsubmit="' + this.id + '.wyswietl(); return false">' + '<input type="text" name="haslo" size="30" onkeyup="' + this.id + '.zaznacz()" class="text">' + '<div><select name="hasla" size="' + (typeof rozmiar != 'undefined' && rozmiar ? rozmiar : 15) + '" ondblclick="' + this.id + '.wyswietl()">' ); for (var i = 0...
- Menu rozwijane, otwierane, wysuwane / Skrypt menu rozwijanego, otwieranego, wysuwanego
...Można tutaj wstawić zwykły tekst, jak również inne elementy - np. obrazek. Aby nagłówek wyglądał jak odsyłacz, można się posłużyć kodem: <a href="javascript:void(0)">Treść nagłówka</a>. Można też wstawić normalny odsyłacz, prowadzący do wybranego dokumentu, jednak wtedy w docelowym dokumencie należy zadbać o wstawienie takiego samego układu menu, ponieważ inaczej nigdy nie będzie dostępu do linków znajdujących się w tej sekcji menu (po kliknięciu menu nie zdąży się rozwinąć, ponieważ...
- Menu drzewiaste / Skrypt menu drzewiastego
...się w węzłach menu (czyli tworzące otwierane i zamykane foldery) nie powinny posiadać atrybutu href="...". Alternatywnie można wpisać tam href="javascript:void(0)". W jednym dokumencie nie może być dwóch elementów z takim samym atrybutem id="...". Dlatego jeżeli chcemy wstawić drugie menu na tej samej stronie, trzeba dla niego użyć już zmodyfikowanego kodu, np.: <ul id="tree1" class="tree"> ... </ul> <script> new Tree("tree1"); </script> Aby menu prezentowało się w pełni...
- Widżety HTML / Wczytywanie strony do ramki lokalnej <a target>
...Jeśli chcielibyśmy aby po kliknięciu odnośnika zmieniła się zawartość dwóch (lub więcej) ramek, można w tym celu użyć JavaScriptu: <a href="javascript:void(0)" onclick="parent.nazwaramki1.location.href = 'adres1.html'; parent.nazwaramki2.location.href = 'adres2.html'; return false">...</a> gdzie "nazwaramki1" i "nazwaramki2" to wartości atrybutów name="..." nadane znacznikom IFRAME. Natomiast "adres1.html" oraz "ades2.html" to adresy (lub względne ścieżki dostępu) stron, które chcemy...
- HTML5 / Filmy i dźwięk <video, audio, source>
Spis treści <video, audio, source> Wstęp Filmy i dźwięk Atrybuty odtwarzacza autoplay controls loop muted playsinline poster preload width, height Formaty audio/wideo MP3/MP4 OGG/OGV Kodeki Kodeki MP4 Kodeki OGG/OGV Wstęp Przed pojawieniem się języka HTML5, istniały już różne sposoby osadzania treści multimedialnych audio/wideo na stronach internetowych: Osadzenie pliku Uniwersalny sposób odtwarzania plików Niestety miały one spore wady: Większość z nich nie...
- Formularze HTML / Pole opcji <input "radio">
Spis treści <input "radio"> Pole opcji <input "radio"> Domyślne zaznaczenie pola <input "radio" checked> Blokada pola <input "radio" disabled> Pole opcji <input "radio"> <form action="..."> <input type="radio" name="nazwa" value="wartość">Tu wpisz opis pola </form> gdzie jako "nazwa" należy wpisać nazwę danego pola (np. skróconą treść pytania), która nie powinna być zbyt długa. Zostanie ona później wysłana wraz z formularzem. Natomiast jako "wartość" podaj treść danej odpowiedzi...
Wstawianie stylów CSS / Wydzielone bloki <div style><div style="cecha: wartość; cecha2: wartość2...">...</div> Jako "cecha" należy wpisać o jakie konkretnie atrybuty formatowania nam chodzi (opisane w kolejnych rozdziałach). Natomiast jako wyraz "wartość" wpisujemy dokładną wartość atrybutu. Fragment dokumentu wydzielony za pomocą bloku <div>...</div> możemy swobodnie formatować. Element ten tak dobrze nadaje się do osadzania stylów, ponieważ sam w sobie nie ma określonego żadnego formatowania, które mogłoby kolidować z efektem, jaki chcemy...
- Formularze HTML / Wyczyszczenie danych <input "reset">
Spis treści <input "reset"> Wyczyszczenie danych <input "reset"> Blokada pola <input "reset" disabled> Potwierdzenie wyczyszczenia formularza <form onreset> Wyczyszczenie danych <input "reset"> <form action="..."> <input type="reset" value="wartość"> </form> gdzie jako "wartość" należy wpisać napis, który pojawi się na przycisku wysyłania formularza. Jeśli opuścimy ten parametr, pojawi się tam domyślny napis, np.: "Resetuj". Komenda wyświetla na ekranie przycisk, po naciśnięciu...