| Autor | Zpráva | ||
|---|---|---|---|
| kozusnik.jan Profil * |
#1 · Zasláno: 23. 6. 2012, 17:51:52
Dobrý den, mohli byste mi poradit, jak to udělat, aby při načtení indexu se na pozadí zobrazila stránka a v popředí by se otevřelo video? Něco, jako bývají ty reklamy, nebo třeba když kliknete na obrázek... Děkuji moc za odpovědi
|
||
| panther Profil |
#2 · Zasláno: 23. 6. 2012, 18:08:39
kozusnik.jan:
je to element s rozměry přes celé okno, pozicovaný a s nejvyšším z-indexem. |
||
| kozusnik.jan Profil * |
#3 · Zasláno: 23. 6. 2012, 18:26:40
děkuji ;) ještě bych teď potřeboval poradit, jak to video "vypnout". Myslel jsem, že to půjde ale mám s tím trochu problém.... Hodím tady celý zdroják, ať na něco nezapomenu.
<html>
<head>
<title></title>
</head>
<body>
<script type="text/javascript">
function video_off() {
document.getElementById(video_off).style.display= none;
}
</script>
<style type="text/css">
#obsah {
width: 100%;
height: 100%;
opacity: 0.8;
filter: alpha(opacity=80);
-moz-opacity: 0.8;
-khtml-opacity: 0.8;
background-color: gray;
border: none;
margin: 0 auto;
}
#video {
opacity: 1;
filter: alpha(opacity=100);
-moz-opacity: 1;
-khtml-opacity: 1;
position: absolute;
left: 250px;
top: 100px;
z-index: 1000;
}
#video img {
width: 650px;
height: 450px;
}
</style>
<div id="obsah">
Blablablablabla
</div>
<div id="video">
<img src="img.jpg">
<a href="#" onClick="video_off()">vypnout video</a>
</div>
</body>
<html> |
||
| panther Profil |
#4 · Zasláno: 23. 6. 2012, 18:30:49
kozusnik.jan:
žádný element s id=video_off neexistuje. A než sem napíšeš znovu, podívej se na základní javascriptovou syntaxi.
|
||
| kozusnik.jan Profil * |
#5 · Zasláno: 23. 6. 2012, 18:38:54 · Upravil/a: kozusnik.jan
Aha. už jsem to našel :D moc díky ;) v JS dělám po dlouhé době a tak bude chvíli trvat, něž se rozkoukám..
Ještě bych potřeboval poradit, jak pomocí JS změnit vlastnost -moz-opacity. Při zapsání document.getElementById("video").style.-moz-opacity=0.9 mi to totiž zvýrazňuje červeně v Dreamweaver, takže tam je asi chyba... nevíte jak to opravit?Edit: už jsem na to přišel... |
||
| kozusnik.jan Profil * |
#6 · Zasláno: 24. 6. 2012, 10:26:57
Už mi to jede v pohodě. Mám ale ještě jeden problém... a sice obrázek se mi taky zobrazuje s opacity = 0,85, i když jsem mu nastavil opacity=1. Nevíte proč?:
<html>
<head>
<title></title>
</head>
<body onLoad="video_on()">
<script type="text/javascript">
function video_on() {
document.getElementById("video").style.display="yes";
document.getElementById("front").style.opacity="0.85";
document.getElementById("front").style.filter="aplha(opacity=85)";
document.getElementById("front").style.MozOpacity="0.85";
document.getElementById("front").style.KhtmlOpacity="0.85";
document.getElementById("front").style.background="gray";
setTimeout("video_off()",10 * 1000 );
var x = odpocet();
var odpocet = document.getElementById("odpocet");
}
function video_off() {
document.getElementById("video").style.display="none";
document.getElementById("front").style.opacity="0";
document.getElementById("front").style.filter="aplha(opacity=00)";
document.getElementById("front").style.MozOpacity="0";
document.getElementById("front").style.KhtmlOpacity="0";
document.getElementById("front").style.background="none";
//document.getElementById("obsah").style.msTransform="100";
}
</script>
<style type="text/css">
#front {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color:none ;
opacity: 0 ;
filter: aplha(opacity=100);
-moz-opacity: 0;
-khtml-opacity: 0;
}
#video {
opacity: 1;
filter: alpha(opacity=100);
-moz-opacity: 1;
-khtml-opacity: 1;
position: absolute;
left: 50%;
top: 50%;
margin-left: -325px;
margin-top: -225px;
z-index:999;
}
#video img {
/* KULATÉ OKRAJE ↓↓↓ */
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
-o-border-radius: 4px;
border-radius: 4px;
border: 4px solid #FFFFFF;
width: 650px;
height: 450px;
z-index: 1000;
}
</style>
<div id="obsah">
Blablablablabla
<div id="front">
<div id="video">
<img src="img.jpg">
<a href="#" onClick="video_off()">vypnout video</a>
</div>
</div>
</body>
<html>Moc děkuji |
||
| panther Profil |
#7 · Zasláno: 24. 6. 2012, 11:12:03
kozusnik.jan:
„a sice obrázek se mi taky zobrazuje s opacity = 0,85, i když jsem mu nastavil opacity=1. Nevíte proč?“ protože je průsvitný jeho rodič. Mimochodem, co si slibuješ od „display: yes“? |
||
| mimochodec_ Profil * |
#8 · Zasláno: 24. 6. 2012, 11:31:17
možná OT: vidím dvakrát "aplha".
|
||
| kozusnik.jan Profil * |
#9 · Zasláno: 24. 6. 2012, 20:52:35
panther:
No já vím, že je stejně průsvitný jako rodič, ale jak to udělat ať není? mimochodec: jak jako dvakrát alpha? |
||
| Keeehi Profil |
kozusnik.jan:
„No já vím, že je stejně průsvitný jako rodič, ale jak to udělat ať není?“ Třeba ho z rodiče vytáhnout ven <prarodič> <rodič s opacity> <img potomek> </rodič> </prarodič> <prarodič> <rodič s opacity> </rodič> <img potomek> </prarodič> |
||
| panther Profil |
#11 · Zasláno: 24. 6. 2012, 20:58:21
kozusnik.jan:
„ale jak to udělat ať není?“ vyjmout ho v kódu z průsvitného rodiče. „jak jako dvakrát alpha?“ aplha |
||
| kozusnik.jan Profil * |
#12 · Zasláno: 24. 6. 2012, 21:07:31
super. díky moc ;)
|
||
|
Časová prodleva: 13 let
|
|||
0