Category Archives

25 Articles

JavaScript a background-position: Jak napozicovat obrázek v pixelech vůči aktuální poloze?

by Zdeněk Večeřa 0 Comments

Na pozadí elementu máme napozicovaný obrázek například takto:

body { url(‚/img/obrazek_pozadi.jpg‘) center top no-repeat; }

Obrázek je úplně nahoře (osa y) a vycentrovaný na střed (osa x). Místo center můžeme použít 50% a místo top 0%.

Představte si situaci, že ho potřebujeme pomocí JavaScriptu posunout o 60 pixelů vlevo (na ose x). V jQuery jsem nenašel způsob, jak to nějak jednoduše udělat. Přes $(‚body‘).css(‚background-position‘); mohu sice zjistit jeho pozici v procentech, ale nikoli v pixelech, což znamená, že nemáme 60 pixelů od čeho odečíst.

Přesměrování stránky bez zachování hlavičky Referer (PHP)

by Zdeněk Večeřa 0 Comments

Někdy můžete chtít ze své stránky odkázat na jiný web tak, aby cílová stránka nezjistila, odkud uživatel přišel (URL). Běžně se to lze dozvědět z hlavičky Referer, pokud ji uživatel neblokuje (například firewallem).

Pro tento případ je proto vhodné připravit mezistránku (například soubor /r.php), které předáte cílovou URL. Stránka odstraní Referer a přesměruje na cílovou, která se tak nedozví původní URL.

Odkaz vygenerujte třeba takto:

echo '<a href="/r.php?u=' . htmlspecialchars(urlencode('http://blog.zdenekvecera.cz/item/category/php'), ENT_QUOTES, 'UTF-8') . '">odkaz</a>';

Řešení problému: Sources directory is already netbeans project (maybe only in memory)

Spokojeně používáte NetBeans, až jednou za jeho běhu přímo ve Windows přejmenujete/přesunete adresář, který doposud sloužil jako cesta k jednomu z projektů.

Daný projekt z NetBeans zmizí a vy se jej pokoušíte přes File -> New Project -> PHP Application with Existing Sources znovu  přidat. Marně, protože pokaždé se vypíše chybová hláška:

Flash vám překrývá prvky s vyšším z-index? Nastavte mu wmode=“opaque“

by Zdeněk Večeřa 0 Comments

Pár flashových pravidel, které je dobré mít na očích (když si je nepamatujete):

  1. Načtení swf souboru z jiné domény:
    <param name=“allowScriptAccess“ value=“always“ />
  2. Respektování z-indexu:
    <param name=“wmode“ value=“opaque“ />
  3. Zakázání fullscreenu:
    <param name=“allowFullScreen“ value=“false“ />
  4. Zakódování URL (urlencode()), clickthru a  clicktag
    <param name=“movie“ value=“http://adstatic.webtea.cz/file.swf?clickthru=http%3A%2F%2Fad.webtea.cz%2Fr%2Fxxx
    %2Fxxx%2F&clicktag=http%3A%2F%2Fad.webtea.cz%2Fr%2Fxxx
    %2Fxxx%2F“ />
  5. Vysoká kvalita:
    <param name=“quality“ value=“high“ />
  6. Barva pozadí:
    <param name=“bgcolor“ value=“#ffffff“ />

Mikrodata, Mikroformáty nebo RDF? Rozhodování skončilo

by Zdeněk Večeřa 0 Comments

Ještě před pár dny jste si možná lámali hlavu nad tím, jestli použít Mikroformáty, které zasahují do class a komplikují tak stylování, anebo raději staré známé RDF či mladá Mikrodata z HTML5. Dnes už je volba zcela jasná.

Mikrodata, jasná volba!

Mikrodata právě vznikla jako kompromis mezi RDF a Mikroformáty. Kvalitu ucítil nejen Google, ale i Bing a Yahoo! Proto pod společným projektem schema.org vsadili na Mikrodata.

Flashové YouTube video, z-index a wmode

by Zdeněk Večeřa 5 Comments

Pokud na stránku vložíte YouTube video přes iframe, což může být flashový přehrávač, a nějaký prvek (třeba div), kterým chcete daný flash překrýt (absolutní pozicování, z-index třeba 102), můžete mít problém. V různých prohlížečích se to chová různě.

Firefox může flashové video bez problému překrýt, Opera také, ale třeba průhledné části divu překreslí černě. O jednotlivých verzích Internet Exploreru ani nemluvě. A třeba Chrome může flashem překrýt celý div, i když to mělo být naopak.

Nastavit CSS vlastnost z-index obyčejně nepomůže. Naštěstí lze problém jednoduše vyřešit pomocí atributu wmode.