Archiwa

Mapa Polski i SVG

Istnieje wiele technik na pokazanie mapy Polski, np. flash lub html + css. Każda z nich ma swoje wady i zalety. Warto jednak zwrócić uwagę na format grafiki wektorowej SVG (ang. Scalable Vector Graphics). Pliki, o tej zawartości, z reguły mają rozszerzenie .svg lub .svgz (dokument SVG skompresowany w formacie gzip). Trzeba pamiętać też o tym, aby z serwera był wysyłany z mime-type image/svg+xml.

Przygotowanie zawartości wektorowej nie jest łatwe, jeśli mielibyśmy robić to ręcznie. Z pomocą jednak przychodzi nam narzędzie o nazwie Inkscape – bezpłatny program do grafiki wektorowej. Nie wspiera[......]

Read more

| kategoria: Artykuły, CSS, HTML i XHTML, Skrypty | Komentarze (0)

JavaScript Quiz

Sprawdź swoją wiedzę na temat JavaScriptu rozwiązując JavaScript Quiz.

Quiz koncentruje się głównie na podstawowej wiedzy jak scoping („zasięg globalny”), funkcje wyrażeń (i w jaki sposób różnią się od deklaracji funkcji), odwołaniach, procesie deklaracji zmiennych i funkcji, itd.

| kategoria: Programowanie, Skrypty | Komentarze (0)

Przekierowania z domeny bez www na domenę z www

Jeśli masz dostęp do serwera www opartego o Apache, to przekierowanie z adresu nie mającego przedrostka www (np. przyklad.pl) na adres www.przyklad.pl możesz łatwo zrobić tak:

  1. RewriteEngine On
  2. RewriteBase /
  3. RewriteCond %{HTTP_HOST} !^www.
  4. RewriteCond %{HTTPS}s ^on(s)|
  5. RewriteRule ^ http%1://www.%{HTTP_HOST}%{REQUEST_URI} [R=301,L]

Rzecz jasna, powyższe uwzględnia również połączenia szyfrowane https.

| kategoria: Server side, Skrypty | Komentarze (0)

Kompresja JavaScript-u

Przy finalnej wersji projektu warto pomyśleć czy nie skompresować pliku z kodem JavaScript. Z pomocą tutaj przychodzi nam narzędzie o nazwie „YUI Compressor Online”. Wg naszych testów skompresowany kod działa poprawnie. Dlaczego o tym piszemy?

Okazało się podczas różnych testów kompresorów, że po niektórych kompresjach kod JavaScript przestawał działać. Dlatego warto dobrze przetestować kompresory JavaScript-u. Sama kompresja kodu JS na pewno nie jest złym pomysłem, bo zyskujemy na transferze i szybkości ładowania się.

| kategoria: JavaScript, Programowanie, Skrypty | Komentarze (2)

Przełączanie widoczne / niewidoczne – javascript + css

Czasem chcemy, aby dany element pojawiał się lub znikał po klinięciu w inny element, np. opcje w ten sposób można pokazywać. Jednym ze sposobów może być stworzenie linka Opcje i podpięcie do niego opcji pokaż / ukryj.

Zastosowanie tutaj linka ma drobną zaletę: kliknięcie od razu kieruje nas do podanego w linku zasobu. Niemniej jednak można kod podany przez nas przerobić tak, aby działał dla każdego elementu. Kolejną sprawą jest to, że wystarczy nadać elementowi a klasę toggle i potem za pomocą JavaScript-u odpowiednio je odnaleźć i podpiąć funkcję. Zatem zaczynamy po kolei.

Najpierw musimy zeb[......]

Read more

| kategoria: CSS, HTML i XHTML, Programowanie, Skrypty | Komentarze (0)

hasAttribute(s) i Internet Explorer (IE)

Javascript-em możemy sprawdzić czy dany atrybut elementu istnieje za pomocą hasAttribute lub czy w ogóle element ma jakieś atrybuty hasAttributes. Niestety, Internet Explorer do wersji 7, nie zna tych funkcji. Jak z tego wyjść? Dla hasAttributes() użyj attributes.length > 0, a dla sprawdzenia czy dany atrybut istnieje, czyli hasAttribute(attrName), użyj getAttribute(attrName) !== null.

| kategoria: Skrypty | Komentarze (0)

Błędna interpretacja przez IE atrybutu alt w znaczniku img

Internet Explorer w wersji 6 w znaczniku img atrybut alt traktuje również jako title. Alt jest do czegoś innego, niż pokazywanie krótkiej informacji w tzw. dymku. Alt funkcjonuje gdy:

  • obrazek się dopiero ładuje
  • z jakiś powodów obrazek nie może być wczytany, np. zły adres url do niego
  • masz wyłączoną grafikę
  • używasz przeglądarki tekstowej
  • używasz screenreadera (przeglądarki czytającej na głos)
  • wyszukiwarki przeszukują zasoby

Można temu zapobiec przez niewielki skrypt poprawiający ten błąd:

  1. function noAltTooltip(){
  2. images = document.getElementsByTagName('img');
  3. for (var i = 0; i < images.length; i++)
  4. {
  5. var ti[......]

Read more

| kategoria: HTML i XHTML, Skrypty | Komentarze (0)

Mapa świata – tylko html i css

Większość jakichkolwiek map geograficznych, które spotykamy w internecie, tworzone są przy użyciu technologii java lub flash. Tymczasem obie technologie mają swoje wady dostępności, przez co niektórzy w ogóle mogą mapy nie zobaczyć/usłyszeć. Ponadto zmuszają nas do zainstalowania odpowiednich plugin-ów. Niemniej jednak można pokusić się o stworzenie mapy geograficznej przy użyciu tylko html i css. Na poniższym przykładzie pokażemy jak można taką mapę świata zbudować.

Zaczynamy od prostej listy kontynentów:

    1. Europa
    2. Ameryka
    3. Azja
    4. Afryka
    5. Oceania

    Następnie przygotowujemy odpowiednio plik graficz[......]

    Read more

    | kategoria: CSS, HTML i XHTML, Programowanie, Skrypty | Komentarze (0)

    Hotlink – test zabezpieczenia

    Hotlink to technika budowania serwisu internetowego w oparciu o cudze zasoby. Mowa tutaj o zajmujących przepustowość i miejsce na serwerze plikach multmedialnych, plikach graficznych, plikach archiwalnych lub programach komputerowych. (Źródło: Wikipedia). Są różne sposoby na zabezpieczenie się przed hotlinkowaniem. Jeśli już zastosowałeś jakieś rozwiązanie, sprawdź, czy jest ono skuteczne za pomocą testu zabezpieczenia przed hotlinkowaniem.

    | kategoria: Server side, Skrypty | Komentarze (0)

    keep looking »

    Polecamy

    Znajdź na stronie

    Pomoc do strony

    Bądź na bieżąco

    do góry