2013-05-13 2 views
2

자바 스크립트와 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이 닫히지 않습니다.

+1

CSS 속성 ('background')은 약식이 아닌 실제 속성 ('background-repeat')을 사용하는 것이 좋습니다. – JJJ

+0

여백 : 0px; => 0 값은 측정 단위 => margin : 0; (이것으로 문제가 해결되지 않을 것입니다.) – Mark

+0

또한 예를 들면? – emaxsaun

답변

2

jslint 또는 jshint을 통해 j를 실행하는 것이 좋습니다. 문제가 발생하면 항상 js를 실행하는 것이 좋습니다. JS와의 크로스 broswer 문제를 일으킬 수있는 많은 오류를 지적합니다. . 나는 당신이 그 오류를 수정하고이 문제를 해결할 수 있는지 제안

Errors: 

Line 3: var e = document.getElementById(a); 

Missing "use strict" statement. 

Line 9: if(e.style.visibility == ""){ 

Expected '===' and instead saw '=='. 

Line 18: var e = document.getElementById(id); 

Missing "use strict" statement. 

Line 21: if(e.style.visibility == ""){ 

Expected '===' and instead saw '=='. 

Line 24: e.innerHTML 

Expected an assignment or function call and instead saw an expression. 

Line 24: e.innerHTML 

Missing semicolon. 

Line 26: d.style.visibility== ""; 

Expected '===' and instead saw '=='. 

Line 26: d.style.visibility== ""; 

Expected an assignment or function call and instead saw an expression. 

Line 30: jwplayer("container").setup({ 

'jwplayer' is not defined. 

Line 1: function closead(a,background) { 

'closead' is defined but never used. 

Line 17: function habilitar(id,id2){ 

'habilitar' is defined but never used. 

Line 17: function habilitar(id,id2){ 

'id2' is defined but never used. 

:

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=""; 

    } 
} 


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" 
    }] 
    }], 
}); 

    } 


} 

가 나에게 다시이 보고서를 제공합니다 : 나는 당신의 JS를 jshint 줄 때

.

+0

가 해결되면서, 버튼의 형태를 제거했습니다. – offboard

관련 문제