CSS fix nebo hack pro rozlišení prohlížeče

Narazil jsem na velmi zajímavý text CSS Fix for Chrome, Safari, and Internet Explorer s živou ukázkou o "rozpoznání" prohlížeče pouhým zápisem definice CSS. CSS sice není validní a zápis je hodně podivný, nicméně to funguje.

Virální video reklama s doplněným "ty"

Skoro před rokem jsem vystavil ukázku Nejlepší virální reklama co pohladí ego. Flashová aplikace nabídla nahrátí vaší fotky a potom ji vložila do velmi lichotivého videa. Už nějakou dobu se ale ono video nezobrazuje, ale nabízí se nové. Výsledek je byl k vidění online (server v zápětí nějak "zmizel").


Podobný typ reklamy používá také třeba Budějovický Budvar, jen vaše "identita" je vložena v textové formě...



Samozřejmě obě reklamy si můžete upravit podle sebe.

Fancybox na Blogger.com

Jak jsem se onehdy svěřil v příspěvku Lightbox pro jQuery, nadchl jsem se pro Fancybox. A nadchl jsem se také pro jQuery, kteroužto js knihovnu Fancybox používá. Rozhodl jsem se tedy použít Fancybox na tomto blogu běžícím na blogger.com, protože mi tu podobná funkce chybí. K mému překvapení jsem takový widget, modyl nebo i jen návod, jak na to, nenašel. Dohledal jsem "jen" návody pro (originální) Lightbox How to add Lightbox effect to Blogger, Light Box Image Viewer For Blogger a Lightbox v2.04 Integration with Blogger Template (to jsou ty funkční), ze kterých jsem ale inspiraci pochopitelně načerpal.

Jak tedy integrovat Fancybox na blogger.com? Nejdříve si někam na web uložte scripty a styly s obrázky Fancyboxu. Odtud si je budete do stránek blogu nasosávat.

Potom je potřeba do šablony do html hlavičky (před tag </head>) vložit nasosnutí scriptů a stylů potřebných pro Fancybox. Editace šablony se provádí v "Návrh" -> "Upravit HTML":

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js' type='text/javascript'/>
<script src='http://VASE.ULOZISTE/fancybox/jquery.mousewheel-3.0.4.pack.js' type='text/javascript'/>
<script src='http://VASE.ULOZISTE/fancybox/jquery.easing-1.3.pack.js' type='text/javascript'/>
<script src='http://VASE.ULOZISTE/fancybox/jquery.fancybox-1.3.3.pack.js' type='text/javascript'/>
<link href='http://VASE.ULOZISTE/fancybox/jquery.fancybox-1.3.3.css' media='screen' rel='stylesheet' type='text/css'/>


Mně se moc líbí ty gumové efekty i přepínání obrázků galerie kolečkem myši, jinak by bylo scriptů o dva méně.

Nicméně ještě je třeba přidat do hlavičky, těsně za nasosnutí scriptů, vlastní spuštění Fancyboxu:

<script type='text/javascript'>
$(document).ready(function(){
   $("a[href$=.jpg],a[href$=.JPG],a[href$=.png],a[href$=.PNG],a[href$=.gif],a[href$=.GIF],a[href$=.bmp],a[href$=.BMP]").fancybox();
});
</script>


Fancybox by šlo zavěsit na odkazy i jinak, ale takto mi to přišlo optimální. Stále mi to ovšem bylo málo! Chtěl jsem, aby se z obrázků u jednoho příspěvku dělala "galerie", a chtěl jsem také, aby se u obrázků vypisoval titulek. Také jsem ošetřil odkaz na obrázky nahrané přímo "do blogu". K tomu jsem využil jQuery a místo předchozího vložil kód tento:

<script type='text/javascript'>
$(document).ready(function(){
   $("a[href$=.jpg],a[href$=.JPG],a[href$=.png],a[href$=.PNG],a[href$=.gif],a[href$=.GIF],a[href$=.bmp],a[href$=.BMP]").each(function(){
        var pu = $(this).parentsUntil('.post-outer');
        var pid = pu.find("a[name]").first().attr("name");
        $(this).attr("rel",pid);
        var pt = pu.find(".post-title a").text();
        var pat = $(this).attr("title");
        $(this).attr("title",pt+(pat?" - ":"")+pat);
        this.href = this.href.replace("\/s1600-h\/","\/s1600\/");
        $(this).fancybox();
   });
});
</script>


Pak jsem přidal ještě několik parametrů pro Fancybox, ale to už si upravte sami ;-)

V rámci výše zmíněného hledání jsem našel i návody Host Javascript File for Free a How to Host Javascript for Blogger, které ale tentokrát nebyly k využití.

P.S.: Zjistil jsem, že novější šablony nedělají odkaz na titulku při zobrazení postu - pak je třeba pro správnou funkci doplňování "title" k obrázkům vyhledávat místo ".post-title a" pouze ".post-title"

Jednoznakové předložky v Adobe InDesign ošetřeny pomocí GREP v definici odstavcového stylu

Jednoznakové předložky dělají při DTP problémy od nepaměti. Snad žádný program je sám od sebe nikdy neošetřoval a bylo třeba vždy používat buďto nějaký modul, plugin, nebo i externí prográmek, kterým se musel text před sazbou upravit. Adobe InDesign ovšem od verze CS3 disponuje úúúúúúúúúžasnou věcí a tou je GREP - takové jako regulární výrazy. V CS3 je sice implementován jen ve vyhledávání, ale od verze CS4 je GREP i v definici odstavcových stylů. V návodu pro InDesign CS4 je to popsáno v kapitole Vytváření stylů GREP, kde najdete popis i odkazy na videa a další návody, jako třeba 5 Cool Things You Can Do with GREP Styles.

Princip práce s GREPem v definici odstavců je jednoduchý - nejdříve si nadefinujte znakový styl, potom si v odstavcovém stylu nadefinujete jaký text se má v textu vyhledávat a automaticky ostylovávat tím kterým znakovým stylem. Ač "ručně" to nelze, GREP znakové styly umožňuje kombinovat.

A právě tohoto lze využít kromě různých "hrátek" také k přilepování jednoznakových předložek. Nejdříve si nadefinujte znakový styl, třeba "nobreak", který má zakázáno rozdělní slov.

Potom do odstavcového stylu, nejlépe toho, ze kterého pak budete odvozovat všechny ostatní, nadefinujte, co všechno by se nemělo dělit, včetně dohledání jednoznakových předložek jednoduchým výrazem

(\<[szkvaiouSZKVAIOU]) \<

V této definici je dále i nedělení čísel s mezerou uvnitř, primitivní nedělení jednotek za číslem, nerozdělení procentní hodnoty a nerozdělování zkratky "o. s." A vše zaručeně funguje. Samo. Automaticky.

(Pokud máte pořád jen InDesign CS3, musíte si vystačit s ruční obluhou "Hledat a nahradit".)

Předložkám či GREPu se také věnují texty Jednoznakové předložky, InDesign a GREP a Adobe InDesign CS3 zblízka: GREP.

České návody pro Adobe InDesign a Illustrator

Návody, manuály a helpy je něco, čím pravověrný uživatel, zejména počítačů potažmo software, z hloubi duše opovrhuje. Ba se jich přímo štítí. A to bez ohledu na stupeň erudice! Nicméně nastane občas chvíle, kdy i zabejčený profík musí stisknout "F1". Ale co když zrovna nesedíte u dotyčného programu?

Naštěstí se některé helpy průběžně přestěhovali na web. Ale kam? No tak třaba pro programy od Adobe je naleznete na webu v sekci Adobe – Podpora.

Odtud už se snadno proklikáte třeba na stránky Nápověda a podpora pro aplikaci InDesign, Používání aplikace Adobe InDesign CS4, Adobe InDesign CS3, Adobe InDesign CS5, nebo Nápověda a podpora pro aplikaci Illustrator, Používání Adobe Illustrator CS4, Adobe Illustrator CS3, Adobe Illustrator CS5.

Top Knihy o Adobe na heureka.cz