<?xml version='1.0' encoding='utf-8'?>
<!DOCTYPE html PUBLIC '-//W3C/DTD XHTML+Voice 1.2 /EN' 'http://www.voicexml.org/specs/multimodal/x+v/12/dtd/xhtml+voice12.dtd'>
<html xmlns='http://www.w3.org/1999/xhtml' xmlns:ev='http://www.w3.org/2001/xml-events'>
<head>
<link rel='canonical' href='http://pabi3.com/blog/prezentacia-v-opere-projection/' />
<link rel='stylesheet' href='http://pabi3.com/modules/items/voice.css' type='text/css' media='all' />
<form xmlns='http://www.w3.org/2001/vxml' id='title'>
<block>
The article Prezentacia v Opere - projection is written by PaBi3
</block>
</form>
<form xmlns='http://www.w3.org/2001/vxml' id='body'>
<block>


Vedeli ste, ze Opera moze zobrazovat prezentaciu, ktora je vytvorena iba v rydzom XHTML
a CSS kode? Áno, aj toto je jedna z jej skvelych vlastnosti. XHTML/CSS sa moze zdat,
ako extremne riesenie a mozno by ste radsej pouzili
OpenOffice.org Impress, ci
Microsoft PowerPoint.
Ti, ktori su zrucnejsi a nechcu iba klikat, si mozu napisat vlastne CSS a vyuzit v nom
selektor page-break-after a nim definovat jednotlive stranky prezentacie.
Zaroven zistia, ze taketo prezentacie prinasaju mnoho vyhod - su velmi dobre prenositelne,
pretoze si ich mozete jednoducho nahrat na internet a premietat kdekolvek, kde je pripojenie,
projektor a Opera.
Pre ulahcenie tvorby prezentacii skuste program QuickShow.
Odkazuju nan aj na oficialnej stranke Opery. Z mojho pohladu je zbytocny (neskusal som ho).
Vsetko si radsej radsej napisem ako stranku v normalnom editore. Predtym, nez sa do niecoho pustite,
precitajte si aj Opera Show Documentation
, kde sa dozviete nove metatagy spojene s prezentaciou.
</block>
</form>
<form xmlns='http://www.w3.org/2001/vxml' id='full'>
<block>
Moj priklad prezentacie (CSS)
/**
 * Element &lt;div class='onscreen'&gt; sa bude
 * zobrazovat pri normalnom prehliadani stranky,
 * teda nie pri prezentacii. 
 */
div.onscreen { display:block; padding:10px; }
div.onscreen kbd { font-weight:bold; color:blue; }

/**
 * Prezentacia bude pouzivat element &lt;div class='page'&gt;,
 * ktory pri media type screen nebude zobrazeny  
 */
@media screen {
  div.page { display:none; }
}

/**
 * Pri aktivovanej projekcii sa element &lt;div class='onscreen'&gt;
 * skryjte a element &lt;div class='page'&gt; naopak zobrazi   
 */
@media projection {
  div.onscreen { display:none; }
  div.page { page-break-after:always; padding:10px; text-align:justify; }
  div.page:last-child { page-break-after:avoid; }
  div.page div.projector { display:block; width:250px; height:160px; background:url('projection.png') top right no-repeat; float:right; }
  div.page ol { list-style-type:none; }
  div.page ol li { font-size:16px; border-bottom:3px solid olivedrab; background:yellowgreen; padding:6px 10px 6px 10px; margin:10px 250px 10px 0; }
  div.pagenum { display:block; font-size:25px; color:midnightblue; border-bottom:1px solid black; margin:0 0 10px 0; }
}


XHTML kod nema zmysel zobrazovat. Prezrite si ho v tomto priklade.
Vsetko som testoval v Opera 9.5 beta.


Odkazy

Opera Show Tutorial (skuste na tejto stranke stlacit F11)
Pouzitie page-breaks podla W3C
Opera Show Generator
</block>
</form>
<base href='http://pabi3.com/' />
<title>Prezentácia v Opere - projection</title>
</head>
<body ev:event='load' ev:handler='#title'>
<a href='http://pabi3.com/blog/prezentacia-v-opere-projection/' title='Návrat'>Návrat</a>
<h1 style='padding:0.5em;'>Prezentácia v Opere - projection</h1>
<ul>
<li ev:event='click' ev:handler='#body'>Speak introduction</li>
<li ev:event='click' ev:handler='#full'>Speak full</li>
</ul>
</body>
</html>

