자바 스크립트와 CSS에도 문제가 있습니다. 2 개의 광고를 순서대로 클릭 할 때만 표시되는 동영상이 있습니다.배너를 숨기려면 JS가 작동합니다. Firefox
<script type="text/javascript">
function closead(a,background) {
var e = document.getElementById(a);
var bg = document.getElementById("background");
bg.style.background = background + " no-repeat";
bg.style.backgroundSize = "100% 100%";
if(e.style.visibility == ""){
e.style.display = "none";
e.innerHTML="";
}
}
</script>
<script type="text/javascript">
function habilitar(id,id2){
var e = document.getElementById(id);
var d = document.getElementById("body_logo");
if(e.style.visibility == ""){
e.style.visibility="hidden";
e.innerHTML="";
e.innerHTML
d.style.visibility== "";
d.style.visibility="hidden";
d.innerHTML="";
jwplayer("container").setup({
height: "97%",
width: "100%",
primary: "flash",
allowscriptaccess: "always",
autostart:true,
playlist: [{
image: "uploads/snapshots/374f9c59b58f880c5e68762bde43318a.jpg",
sources: [{
file: "uploads/374f9c59b58f880c5e68762bde43318a.mp4",
label: "360p"
},{
file: "uploads/374f9c59b58f880c5e68762bde43318a.flv",
label: "240p"
}]
}],
});
}
}
</script>
<div id="file_title" >
<a href="#" target="_blank"><strong>Game.of.Thrones.S03E06.HDTV.XviD.Dual.Audio.THESPEEDBR.COM</strong></a>
</div>
<div id="background" style="background-image:url('images/logomarca/video/embed_background.jpg'); width:100%; height:100%;">
<div id="body_logo" style="width:100%;">
<div style="position:absolute; top:8%; margin:0 auto; height:250px; height:100%; width:100%; z-index:2; " id="ad2">
<div id="propaganda2" >
<div class="player_hover">
<!-- BEGIN ATF 300PX X 250PX --><a href="#" target="_blank"><img src="images/videos_anuncios/propaganda-3.jpg" height="250" width="300" /></a>
</div>
<form method="post">
<input type="hidden" value="bar" name="foo">
<input name="confirm" type="submit" onClick="habilitar('propaganda2');" value="Start Video Now" class="confirm_button" style="width:250px;">
</form>
</div>
</div>
<div style="position:absolute; top:8%; margin:0 auto; height:250px; height:100%; width:100%; z-index:2; " id="ad1">
<div id="propaganda1">
<div class="player_hover">
<!-- BEGIN ATF 300PX X 250PX --><a href="#" target="_blank"><img src="images/videos_anuncios/propaganda-3.jpg" height="250" width="300" /></a>
<img src="propaganda-3.jpg" height="250" width="300" />
</div>
<form method="post">
<input name="confirm" type="submit" onClick="closead('ad1','url(uploads/snapshots/374f9c59b58f880c5e68762bde43318a.jpg)');" value="Close Ad and Watch as Free User" class="confirm_button" style="width:250px;">
</form>
or <a href="admin/index.php?pagina=premium" target="_blank">Get Pro Account</a> to get rid of the ads
</div>
</div>
</div>
<div style="position:absolute; width: 100%; height: 100%">
<div id="container"></div>
</div>
</div>
</body>
</html>
은 모질라에서 완벽하게 작동하지만 다른 브라우저에서는 제대로 작동하지 않습니다. 문제를 식별 할 수 없었습니다. 누군가가
html, body {
background-color:#000;
margin:0px;
padding:0px;
height: 100%;
width: 100%;
overflow: hidden;
font-family:"Lucida Grande","Lucida Sans Unicode","Lucida Sans",Helvetica,Arial,sans-serif;
font-size:12px;
line-height:22px;
background-color:#000;
}
#container {
}
#file_title {
color:#FFF;
text-align:center;
height:20px;
padding:5px;
}
#file_title a {
color:#39C;
text-decoration:none;
font-weight:bold;
}
#file_title a:hover {
color:#FFF;
}
#propaganda1 {
width:100%;
height:330px;
text-align:center;
font-size:12px;
color:#CCC;
}
#propaganda2 {
width:100%;
height:330px;
text-align:center;
font-size:12px;
color:#CCC;
}
#propaganda1 a {
color:#fff;
text-decoration:underline;
}
#propaganda2 a {
color:#fff;
text-decoration:underline;
}
#propaganda strong {
display:block;
padding:5px;
font-size:16px;
}
#propaganda strong a {
color:#F60;
}
#propaganda strong a:hover {
color:#F00;
}
.confirm_button {
font-weight:bold;
padding:4px;
margin:3px auto;
}
#deleted, #disabled {
width:400px;
background-color:#000;
text-align:center;
color:#FFF;
font-size:17px;
padding:130px 10px 130px 10px;
margin:30px auto;
border:#CCC 1px solid;
}
#disabled a {
color:#C00;
display:block;
margin:5px;
}
#disabled a:hover {
color:#900;
}
#password_box {
width:400px;
background-color:#000;
text-align:center;
color:#FFF;
font-size:17px;
padding:110px 10px 110px 10px;
border:#CCC 1px solid;
margin:30px auto;
}
img#bg {
position:absolute;
z-index:-1;
}
.play_button {
color:#FFF;
font-weight:bold;
line-height:30px;
}
.play_button strong {
display:block;
text-align:center;
width:100px;
margin:0px auto;
color:#FFF;
}
.play_button a {
width:90px;
height:90px;
display:block;
background-image:url(../images/play_button.gif);
background-repeat:no-repeat;
background-position:-90px 0;
margin:auto auto;
}
.play_button a:hover {
background-position:0 0;
}
.video_player {
margin:0px auto;
}
.player_hover_ad {
width:300px;
height:250px;
background-color:#FFF;
text-align:center;
padding:5px;
margin:10px auto 10px auto;
-moz-border-radius:5px;
border-radius: 5px;
-webkit-border-radius: 5px;
}
#playdiv {
width:100%;
height:360px;
text-align:left;
padding:0px;
color:#FFF;
position:relative;
z-index:1;
}
테스트하려는 경우
이 내 CSS는 내가 CSS를 해결하기 위해 관리하지만, 자바 스크립트가 작동하지 않습니다. 버튼을 클릭해도 Chrome이 닫히지 않습니다.
CSS 속성 ('background')은 약식이 아닌 실제 속성 ('background-repeat')을 사용하는 것이 좋습니다. – JJJ
여백 : 0px; => 0 값은 측정 단위 => margin : 0; (이것으로 문제가 해결되지 않을 것입니다.) – Mark
또한 예를 들면? – emaxsaun