target - Kurs HTML i CSS
Widżety HTML / Wczytywanie strony do ramki lokalnej <a target>Spis treści <a target> Wczytywanie strony do ramki lokalnej <a target> Wczytanie stron do dwóch ramek Wczytywanie strony do ramki lokalnej <a target> <a target="cel" href="lokalizacja">opis</a> Jak widać powyższe polecenie jest odsyłaczem. Posiada on jednak dodatkowy atrybut target="..." pozwalający wczytać stronę do wybranej przez nas ramki - w szczególności innej niż ta, w której znajduje się odnośnik. Dzięki temu treść w takiej ramce (okienku) może się zmieniać, nawet już po...
Selektory pseudoklas CSS / Etykieta :target(CSS 3 - interpretuje Internet Explorer 9, Firefox, Opera, Chrome) selektor:target { cecha: wartość } Selektorem może być praktycznie dowolny znacznik, który posiada atrybut id="..." albo ewentualnie może to być element A posiadający atrybut name="..." [zobacz: Odsyłacz do etykiety i Wstawianie stylów]. Natomiast wyrazy "cecha" oraz "wartość" określają atrybuty elementu nadane poprzez style i zostaną opisane w dalszych rozdziałach. Czasami podział serwisu na podstrony jest niewystarczający...
Galeria zdjęć HTML / Skrypt galerii zdjęć...GalleryView.prototype.close = function(callback) { clearTimeout(this._timeout); this._listeners.forEach(function(listener) { listener.target.removeEventListener(listener.type, listener.callback); }); this._listeners = []; this.container.parentNode.removeChild(this.container); document.body.style.overflow = this._overflow; this._reset(); if (callback) { callback(); } }; GalleryView.prototype.display = function(image, first, last) { this[first ? '_hide...
- Losowy element
...{ if (typeof limit == 'undefined' || limit < 0) limit = 1; else if (!limit) limit = this.length; for (var i = 0, source = this, target = new Array(), n = source.length; i < limit && n > 0; i++) { do { var index = Math.random(); } while (index == 1); index = Math.floor(index * n); target.push(source[index]); source[index] = source[--n]; } return target; } document.write(new Array( // Tu wpisz kolejne elementy: 'Tekst 1', 'Tekst 2', 'Tekst 3...
- Aktualizacja / System newsów
...author': '', // autor 'email': '', // e-mail 'img': '', // obrazek 'width': '', // szerokość obrazka 'height': '', // wysokość obrazka 'target': '' // ramka (target="...") ////////// }; this.il_dni = typeof days != 'undefined' ? days : this.config['days']; var now = new Date(); var content = ''; this.dodaj = function(dzien,miesiac,rok, tytul,tresc, adres,ramka, dodal,email, obraz,width,height) { if (!this.il_dni || (now - new Date(rok, miesiac-1...
- HTML5 / Piaskownica zabezpieczająca <iframe sandbox>
...zezwala na używanie API blokującego wskaźnik myszki. allow-popups - pozwala na otwieranie wyskakujących okien oraz używanie atrybutu target="_blank". Każde nowe okno, które zostanie otwarte przez stronę w ramce, przejmuje wszystkie ograniczenia nałożone atrybutem sandbox. allow-popups-to-escape-sandbox - pozwala, aby otwarte nowe okna nie miały już żadnych ograniczeń. Może to być przydatne np. w przypadku wyświetlania reklam. Chcielibyśmy mieć pewność, że reklama niczego nie...
- Galeria zdjęć HTML / Klasyczna galeria zdjęć
...bezpośrednio jego miniaturki. Aby zastosować taki efekt, należy użyć odsyłacza obrazkowego (podstawowego). Prawie zawsze stosuje się również atrybut target="_blank", który powoduje otwarcie nowego okna przeglądarki: <a target="_blank" href="ścieżka do dużego obrazka"><img src="ścieżka do pliku miniaturki obrazka" alt="Tekst alternatywny" border="0"></a> Większość nowych przeglądarek potrafi automatycznie otworzyć obrazek w nowym oknie, jednaki nie będzie wtedy możliwości szybkiej nawigacji...
- Dobre praktyki / Przykazania webmastera
...tradycyjnych jak i lokalnych Nie stosuj tabelek do budowania układu strony Nawigacja musi być intuicyjna i wygodna Unikaj używania atrybutu target="..." dla odsyłaczy Nie używaj znaczników img do wstawiania grafiki tworzącej oprawę graficzną strony Zawsze wypełniaj atrybut alt="..." dla ilustracji Zapisuj ilustracje we właściwych formatach graficznych Stosuj fizycznie pomniejszone miniatury zdjęć Strona powinna być czytelna bez grafiki Stosuj inny tytuł na każdej podstronie...
- Komendy HTML 4.01 / Deklaracja typu dokumentu
...które nie są zdeprecjonowane (nie deprecated) oraz nie pojawiają się w dokumentach z ramkami (ponadto nie obejmuje elementu IFRAME ani atrybutu target="...") <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> lub <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> Transitional DTD - (przejściowa) lub inaczej loose DTD ("luźna") - zawiera wszystko co w Strict DTD plus elementy i atrybuty zdeprecjonowane oraz element IFRAME i atrybut target...
- HTML5 / Przeciągnij i upuść <... draggable>
...takie jak dragstart, dragover, i drop. Przykład prostego kodu: <div draggable="true" ondragstart="event.dataTransfer.setData('text/plain', event.target.id)" id="dragItem">Przeciągnij mnie</div> <div ondragover="event.preventDefault()" ondrop="handleDrop(event)" id="dropZone">Upuść tutaj</div>. Jak umieścić przeciąganie w HTML? Aby umożliwić przeciąganie elementu w HTML, należy ustawić atrybut draggable="true" na elemencie, który ma być przeciągany, oraz obsłużyć zdarzenia dragstart...