javascript - JS to hide banner only works Firefox -
i have problem in javascript , css also. have video displayed when click on 2 ads in sequence.
<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 , watch free user" class="confirm_button" style="width:250px;"> </form> or <a href="admin/index.php?pagina=premium" target="_blank">get pro account</a> rid of ads </div> </div> </div> <div style="position:absolute; width: 100%; height: 100%"> <div id="container"></div> </div> </div> </body> </html> works in mozilla not in other browsers, not identify problem.
this css if want test
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 { 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 { color:#fff; text-decoration:underline; } #propaganda2 { color:#fff; text-decoration:underline; } #propaganda strong { display:block; padding:5px; font-size:16px; } #propaganda strong { 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 { 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 { 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; } i managed fix css, javascript not work. in chrome not close when click button
it's idea run js through jslint or jshint when having problems - points out lots of little errors can cause cross-broswer issues js.
when give jshint js:
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" }] }], }); } } it gives me report back:
errors: line 3: var e = document.getelementbyid(a); missing "use strict" statement. line 9: if(e.style.visibility == ""){ expected '===' , instead saw '=='. line 18: var e = document.getelementbyid(id); missing "use strict" statement. line 21: if(e.style.visibility == ""){ expected '===' , instead saw '=='. line 24: e.innerhtml expected assignment or function call , instead saw expression. line 24: e.innerhtml missing semicolon. line 26: d.style.visibility== ""; expected '===' , instead saw '=='. line 26: d.style.visibility== ""; expected assignment or function call , instead saw expression. line 30: jwplayer("container").setup({ 'jwplayer' not defined. line 1: function closead(a,background) { 'closead' defined never used. line 17: function habilitar(id,id2){ 'habilitar' defined never used. line 17: function habilitar(id,id2){ 'id2' defined never used. i suggest fix errors , see if solves problem.
Comments
Post a Comment