HTML, CSS, JavaScript

Osm pravidel pro vkládání JavaScriptu do šablony

Osm pravidel pro vkládání JavaScriptu do šablony

V dnešním článku se budu věnovat JavaScriptu úplně od začátku. Spousta začínajících vývojářů často chybuje v poměrně základních věcech, a tak bych rád uvedl některé z nich na pravou míru. Dodržování těchto pravidel vám pomůže dosáhnout čistého kódu, správné implementace složitých funkcí a naučí vás udržovat si pořádek v šablonách. Kromě tipů na nasazování vlastních či cizích knihoven uvedu i některé rady, jak předejít nepochopitelnému chování, na jehož řešení už bývá většinou pozdě, pokud nastane.

Celý článek

JavaScriptové ekvivalenty PHP funkcí

JavaScriptové ekvivalenty PHP funkcí

Při studiu a práci s JavaScriptem jsem mnohokrát narazil na situace, kdy mi standardní JavaScriptové funkce nestačily. Řešení v PHP by bylo triviální, ovšem v JavaScriptu dané funkce prostě chyběly. Trochu jsem hledal a narazil na zajímavý projekt phpjs.org, kde jsem objevil rozsáhlou knihovnu PHP funkcí přepsaných do JS. Samozřejmě mi nedalo se o ně nepodělit.

Celý článek

JavaScript: práce s GETem jako v PHP

JavaScript: práce s GETem jako v PHP

Tak, jako v PHP pracujeme s parametry oddělenými otazníkem a následně ampersandem (&), můžeme v JavaScriptu pracovat s kotvami. Nejčastější využití takzvané kotvy spočívá v odkazu na nadpis či odstavec dále v textu nebo přímý odkaz na aktivní záložku. Pomocí hodnoty kotvy ale můžeme v kódu podmiňovat naprosto cokoli. Tak, jako query string ?arg=value&page=3 splní svůj účel, může pracovat i kotva ve tvaru #arg=value&page=neco. PHP takový řetězec v URL už rozpoznat nedokáže, kdežto JavaScript si z něj umí vzít potřebné hodnoty.

Celý článek

CSS hacky pro nejpoužívanější prohlížeče

CSS hacky pro nejpoužívanější prohlížeče

Odlišené vykreslení různými prohlížeči je věc, která dříve či později potrápí každého kodéra. Ať už se jedná přímo o bugy, nebo pouze o drobný rozdíl při vykreslování konkrétních prvků, je potřeba dosáhnout shody ve všech majoritních prohlížečích. Chyby Internet Exploreru a způsoby, jak je obejít jsou dávno obecně známé, ovšem o umravnění zlobivého Firefoxu nebo Google Chrome se tolik nemluví. I když je v kodérově nejlepším zájmu, psát styly tak, aby hacků použil co nejméně, nastávají situace, kdy se jim vyhnout nemůžeme. Oprava stylů po někom jiném je práce, kterou nikdo nemá rád a nechce dělat, ale také vhodná chvíle, kdy nasadit CSS hacky.

Celý článek

Test: Jak dobře umíte CSS?

Test: Jak dobře umíte CSS?

CSS není jen o znalosti atributů a jejich vykreslení v tom či jiném prohlížeči - CSS skrývá i spoustu dalších úskalí. Denně přicházím do kontaktu s weby, jejichž stylové předpisy mají 30 kilobytů či více, a věřte nevěřte, jsou i případy, kdy se přidání nebo smazání některé globální definice rovná píchnutí do vosího hnízda. Někdy totiž nestačí pouze vyladění pro nejpoužívanější prohlížeče - člověk musí znát i způsoby zápisu té samé definice a prioritu, kterou bude mít oproti definicím ostatním. Říká se, že poslední definice platí...

Celý článek

Mýty a pověry okolo Box Modelu

Mýty a pověry okolo Box Modelu

Při hledání odpovědi co přesně se Internet Exploreru honí hlavou když se přepíná do Quirk módu a proč tomu tak činí jsem narazil na spoustu článků, popisující chování IE při pár konkrétních DTD, ale všude vždy 2, maximálně 3 příklady. Stejně tak, jako se všichni zabývají neustále jen Box Modelem a některé další důležité neshody opomíjí.

Vytvořil jsem si proto 5 různých html dokumentů s pěti různými Doctype a zkoumal jejich chování v IE5, IE6 a IE7. Krom vykreslení rámečku jsem testoval i dvě další vlastnosti, s jejichž odlišnou interpretací jsem se v minulosti setkal. Ve dvou dílech svých CSS tutoriálů jsem vždy popisoval řešení, jak potencionální problémy obejít, jak se jim vyhnout. Pokud ale předpovíme přesné chování Exploreru, můžeme toho i využít a viditelně si ulehčit práci.

Celý článek

CSS, pokročilé stylování: pseudo-třídy a selektory

CSS, pokročilé stylování: pseudo-třídy a selektory

Návštěva odborného weblogu reinholdweber.com a otestování Diagnostického CSS skriptu mě inspirovalo k napsání dalšího článku na tematiku kaskádových stylů, tentokrát trochu podrobněji o pseudo~třídách a selektorech. Text se týká částečně i CSS3, hlavně ale porovnání interpretace nejrozšířenějšími prohlížeči. Který z nich na tom skončil nejhůř snad ani uvádět nemusím… Nejdříve tedy k takzvaným pseudo~třídám.

Třídy jako :hover či :first-letter byste měli snad všichni znát, existuje však i spousta dalších. Uvádět zde všechny nemá smysl, pohovořím jen o těch, jejichž použití se nám mnohdy samo nabízí.

Celý článek

XHTML 2 versus HTML 5

XHTML 2 versus HTML 5

Nedávno jsem narazil na poměrně zajímavý článek na serveru xhtml.com popisující změny v připravovaných verzích značkovacích jazyků HTML 5 a xHTML 2. Některé z nich vypadají opravdu zajímavě, jiné jsou podle mého názoru nesmyslné a spousta z nich je pouze "vata"... Článek jsem přeložil na nabídnu Vám ho k přečtení na svém blogu.

Celý článek

CSS layout, aneb web bez tabulek - tutoriál

Jak jsem již zmínil v poslední článku, existují 3 způsoby, kterými můžete vytvořit lay-out pro svůj web. Rámy, tabulky nebo tzv. striktní div/CSS. Rámy snad ani nemusím komentovat, ovšem horší je to s tabulkami. I dnes mnoho webů používá tento nesprávný způsob rozvržení. Tabulka je určena pro zobrazování tabulkových dat, a ne pro lay-out celého webu. Na popud všech těch stránek / tabulek jsem se rozhodl napsat následující tutoriál. Doufám, že Vám alespoň trochu pomůže. To by snad na úvod stačilo, a pustíme se do toho =o)

Nejdřív si vytvoříme jednoduchou (x)HTML stánku a vhodně do ní umístíme divy. (nečti jako Ď =o) ) Divů není nikdy dost, a když náhodou jeden neostylujeme, nic se nestane. Stránka by mohla vypadat nějak takto: index.htm. A protože chceme mít moderní web se vším všudy, začneme rovnou s XHTML 1.0 Strict =o) Do stránky zatím nebudeme vkládat žádný obsah a pustíme se do samotného stylopisu.

Celý článek

| 2

Parak simati, Muballit mitte, Nergal allatu mellamu mesaru, La tapallah Annuaki, Kettu Puluthu qillatua