Publikační řešení Triobo umí pracovat s vnořeným kódem v HTML5, viz HTML objekt. Pokud umíte v HTML5 vytvářet například jednoduché animace, formuláře, nebo dokonce hry, nic vám nebrání použít je na stránce časopisu pro tabletové vydaní. Pamatujte, že Apple iPad používá vykreslovací jádro WebKit (stejně jako Safari nebo Chrome na vašem počítači), dodržte tedy požadovanou syntaxi. Jakékoli zdroje, které odkážete v kódu HTML, budou dostupné ve stejné pomyslné složce v tabletu, nezadávejte tedy žádné cesty!
Jednoduchá ukázka rotujícího loga.
Předpokládejme, že máte k dispozici obrázek s názvem logo.png o rozměrech 180 x 80 px. Založte ve složce se zdroji článku u sebe na počítači následující kód HTML:
<html>
<head>
<title>iframe</title>
<style>
body {margin:0;padding:0;}
#plocha{
display:block;
width:200px;
height:120px;
overflow:hidden;
-webkit-perspective: 300;
-webkit-perspective-origin: 100px 75px;
}
#logo{
position: relative;
top: 20px;
margin: 0 auto;
height: 80px;
width: 180px;
background: #ddd url(logo.png) no-repeat; /* nezadávejte žádné cesty, ani lomítko! */
-webkit-transform-style: preserve-3d;
-webkit-animation: spin 8s infinite linear;
}
@-webkit-keyframes spin {
from { -webkit-transform: rotateY(0); }
to { -webkit-transform: rotateY(-360deg); }
}
</style>
</head>
<body>
<div id="plocha"><div id="logo"></div></div>
</body>
</html>