Nová ukázka
Reset
Načíst z URL
Uložit a získat odkaz
Vztahuje se k…
Nevyplňujte
Napiště „nejsem robot“
▶
Přepnout zobrazení
Výsledek
<div id="obal"> <div id="obsah"> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Necessitatibus vero!</p> <p>Dignissimos minima quasi incidunt beatae ipsum nobis quod delectus et.</p> <p>Praesentium ducimus a aliquid vel consectetur laboriosam debitis minus voluptatibus.</p> <p>Nulla pariatur ad eos laboriosam porro vitae sapiente reiciendis iste!</p> <p>Vero illum libero amet fugiat incidunt. Ut itaque eaque hic.</p> <p>Vitae at eos hic obcaecati fugit ipsam. Illo excepturi libero!</p> <p>Aliquid molestias magni possimus eligendi cum consequuntur sit hic quidem.</p> <p>Corporis delectus saepe sed reiciendis nisi incidunt possimus error alias.</p> <p>Vel officiis fugit sequi enim veritatis laborum quod temporibus ad!</p> <p>Error nam cupiditate cumque harum unde veritatis ab similique voluptatum.</p> </div> </div>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
#obsah, .klon {width: 812px; height: 516px;} .klon { position: absolute; top: 0; visibility: hidden; -webkit-filter: blur(3px) } #obsah, .klon {background-image: url('http://pokusy.1-webdesign.cz/clip/ah02.jpg')}
CSS
Autoformát
CSS reset
Až na konci
var klon = document.getElementById("obsah").cloneNode(true); klon.className = "klon"; klon.id = "druhy"; document.getElementById("obal").appendChild(klon); document.onmousemove=ukazVyrez; function ukazVyrez(e) { x=(e?e:event).clientX; y=(e?e:event).clientY; document.getElementById("druhy").style.visibility="visible"; document.getElementById("druhy").style.clip="rect("+(y-60)+"px "+(x+60)+"px "+(y+60)+"px "+(x-60)+"px)"; }
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>