vtsokalo Posted September 25, 2013 at 07:21 PM Report #525985 Posted September 25, 2013 at 07:21 PM Boas, tenho um pequeno problema com um template. Fiz o download da seguinte template (http://sdrv.ms/18pQx9Q), que tenciono usar na minha PAP de informática. Quando tentei fazer em javascript uma pequena janela que aparecesse a frente ao clicar num botão, vi que não aparecia nada. Depois de remover o background, vi que a janela estava lá, o problema é que o background tapa a janela, ou seja está a frente dela. Queria por a janela a frente do background, como é obvio. Segue aqui o código da página principal. <!DOCTYPE html> <!--[if IE 7 ]><html class="ie ie7" lang="en"> <![endif]--> <!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]--> <!--[if (gte IE 9)|!(IE)]><!--><html lang="en" class="ie ie9"> <!--<![endif]--> <head> <meta charset="utf-8"> <meta name="description" content=""/> <meta name="keywords" content=""/> <!-- Mobile Specific Metas +++++++++++++++++++++++++++ --> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <link rel="shortcut icon" href="img/favico.ico"> <link rel="apple-touch-icon" href="img/apple_icons_57x57.png"> <link rel="apple-touch-icon" sizes="72x72" href="img/apple_icons_72x72.png"> <link rel="apple-touch-icon" sizes="114x114" href="img/apple_icons_114x114.png"> <title>Frame - Top notch multipurpose HTML5 Theme.</title> <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,600,700,800,400italic,600italic,700italic' rel='stylesheet' type='text/css'> <link rel="stylesheet" type="text/css" href="css/bootstrap.css"> <link rel="stylesheet" type="text/css" href="css/bootstrap-responsive.css"> <link rel="stylesheet" type="text/css" href="css/plugins.css"> <link rel="stylesheet" type="text/css" href="css/theme.css"> <link rel="stylesheet" type="text/css" href="css/responsive.css"> <link rel="stylesheet" type="text/css" href="css/theme_settings.css"> <link rel="stylesheet" type="text/css" href="css/skin.css"> <link rel="stylesheet" type="text/css" href="css/color_theme.css" id="theme_color"> <!--[if IE 8 ]> <link rel="stylesheet" type="text/css" href="css/ie_css.css"> <script> var e = ("article,aside,figcaption,figure,footer,header,hgroup,nav,section,time").split(','); for (var i = 0; i < e.length; i++) { document.createElement(e[i]); } </script> <![endif]--> <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> <link rel="stylesheet" type="text/css" href="css/fs_gllaery.css"> <script type="text/javascript" src="js/fs_gllaery.js"></script> <script language="javascript"> function show_popup(id) { if (document.getElementById){ obj = document.getElementById(id); if (obj.style.display == "none") { obj.style.display = ""; } } } function hide_popup(id){ if (document.getElementById){ obj = document.getElementById(id); if (obj.style.display == ""){ obj.style.display = "none"; } } } </script> </head> <body class="fullscreen_layout"> <div id="my_popup" style="display:none;border:1px dotted gray;padding:.3em;background-color:white;position:absolute;width:200px;height:200px;left:100px;top:100px"> <div align="right"> <a href="javascript:hide_popup('my_popup')">close</a> </div> <h3>Vooler PopUp</h3> <p>You contents go here, whatever style or anything</p> </div> <header class=""> <div class="header_wrapper container"> <a href="index.html" class="logo"><img src="img/logo.png" alt="" class="logo_def" width="125" height="39"><img src="img/retina/logo.png" alt="" class="logo_retina" width="125" height="39"></a> <nav> <ul class="menu"> <li class="current-menu-parent"><a href="index.html">HOME</a> </li> <li><a href="javascript:void(0)">PORTFOLIO</a> <ul class="sub-menu"> <li><a href="portfolio_grid.html">Grid Portfolio</a></li> <li><a href="portfolio_masonry.html">Grid Portfolio with Masonry</a></li> <li><a href="portfolio_post_fw.html">Fullscreen Portfolio Post</a></li> <li><a href="portfolio1.html">Portfolio 1 Column</a></li> <li><a href="portfolio2.html">Portfolio 2 Columns</a></li> <li><a href="portfolio3.html">Portfolio 3 Columns</a></li> <li><a href="portfolio4.html">Portfolio 4 Columns</a></li> <li><a href="portfolio_post.html">Portfolio Post</a></li> </ul> </li> <li><a href="javascript:void(0)">VIDEOS</a> <ul class="sub-menu"> <li><a href="gallery_kenburns.html">Kenburns Gallery</a></li> <li><a href="gallery_grid.html">Grid Gallery</a></li> <li><a href="gallery_masonry.html">Grid Gallery with Masonry</a></li> </ul> </li> <li><a href="javascript:void(0)">BLOG</a> <ul class="sub-menu"> <li><a href="blog_fullscreen.html">Fullscreen</a></li> <li><a href="blog_post_fw.html">Fullscreen Blog Post</a></li> <li><a href="blog_full.html">Full Width</a></li> <li><a href="blogpost_full.html">Blog Post</a></li> <li><a href="javascript:void(0)">With Sidebar</a> <ul class="sub-menu"> <li><a href="blog_left.html">Left Sidebar</a></li> <li><a href="blog_right.html">Right Sidebar</a></li> <li><a href="blogpost_sidebar.html">Blog Post</a></li> </ul> </li> </ul> </li> <li><a href="javascript:void(0)">CONTACTS</a> <ul class="sub-menu"> <li><a href="contact_fullscreen.html">Fullscreen</a></li> <li><a href="contact.html">Full Width</a></li> <li><a href="contact_sidebar.html">With Sidebar</a></li> </ul> </li> <li><a href="javascript:void(0)">FOLLOW</a> <ul class="sub-menu"> <li><a href="typography.html">Typography</a></li> <li><a href="shortcodes.html">Shortcodes</a></li> </ul> </li> <li><a href="login.php">LOGIN </a> <ul class="sub-menu"> <li><a href="registar.html">REGISTO</a></li> </ul> </li> </ul><!-- .menu --> <div class="clear"></div> </nav> </div> </header> <div class="fullscreen_block"></div> <script> gallery_set = [ //Gallery Data {image : 'img/gallery/gallery01.jpg', thmb : 'img/gallery/thmb/gallery01.jpg', alt : 'Awesome Theme', fit : 'cover', title : "Awesome Theme", description: "right here we've got something you gonna love..."}, {image : 'img/gallery/gallery02.jpg', thmb : 'img/gallery/thmb/gallery02.jpg', alt : 'Lorem ipsum', fit : 'cover', title : "Lorem ipsum", description: "lorem ipsum dolor sit amet, consectetur adipiscing."}, {image : 'img/gallery/gallery03.jpg', thmb : 'img/gallery/thmb/gallery03.jpg', alt : 'Dolor sit amet', fit : 'cover', title : "Dolor sit amet", description: "proin molestie pulvinar lorem sit amet placerat."}, {image : 'img/gallery/gallery04.jpg', thmb : 'img/gallery/thmb/gallery04.jpg', alt : 'Ut luctus viv', fit : 'cover', title : "Ut luctus viv", description: "vestibulum ante ipsum primis in faucibus orci luctus."}, {image : 'img/gallery/gallery05.jpg', thmb : 'img/gallery/thmb/gallery05.jpg', alt : 'Duis ante veli', fit : 'cover', title : "Duis ante veli", description: "ut eu urna eu ipsum ultrices dapibus sit amet"}, {image : 'img/gallery/gallery06.jpg', thmb : 'img/gallery/thmb/gallery06.jpg', alt : 'Mauris pretium', fit : 'cover', title : "Mauris pretium", description: "luctus viverra urna non fermentum sit dolor."}, {image : 'img/gallery/gallery07.jpg', thmb : 'img/gallery/thmb/gallery07.jpg', alt : 'Praesent doro', fit : 'cover', title : "Praesent doro", description: "commodo nulla magna, vel dignissim dui aliquet eu."}, {image : 'img/gallery/gallery08.jpg', thmb : 'img/gallery/thmb/gallery08.jpg', alt : 'Curabitur ut', fit : 'cover', title : "Curabitur ut", description: "ante velit, blandit quis lacus eu, tincidunt vulputate."}, {image : 'img/gallery/gallery09.jpg', thmb : 'img/gallery/thmb/gallery09.jpg', alt : 'Vestibulum eget', fit : 'cover', title : "Vestibulum eget", description: "varius interdum mauris sagittis tempor."}, {image : 'img/gallery/gallery10.jpg', thmb : 'img/gallery/thmb/gallery10.jpg', alt : 'Curabitur pulvinar', fit : 'cover', title : "Curabitur pulvinar", description: "mauris pretium facilisis nisl nec suscipit."}, {image : 'img/gallery/gallery11.jpg', thmb : 'img/gallery/thmb/gallery11.jpg', alt : 'Cras lobortis est', fit : 'cover', title : "Cras lobortis est", description: "quisque in ante ut augue rutrum venenatis urna."}, {image : 'img/gallery/gallery12.jpg', thmb : 'img/gallery/thmb/gallery12.jpg', alt : 'Sed non ante', fit : 'cover', title : "Sed non ante", description: "curabitur mollis aliquet ligula tincidunt venenatis."}, {image : 'img/gallery/gallery13.jpg', thmb : 'img/gallery/thmb/gallery13.jpg', alt : 'Aliquam tincidunt', fit : 'cover', title : "Aliquam tincidunt", description: "integer risus nibh, elementum non blandit suscipit."}, {image : 'img/gallery/gallery14.jpg', thmb : 'img/gallery/thmb/gallery14.jpg', alt : 'Ut nec diam ac', fit : 'cover', title : "Ut nec diam ac", description: "morbi et dignissim tellus, eu porttitor lacus."}, {image : 'img/gallery/gallery15.jpg', thmb : 'img/gallery/thmb/gallery15.jpg', alt : 'Dignissim ac nec', fit : 'cover', title : "Dignissim ac nec", description: "in id pellentesque libero, id luctus enim."}, {image : 'img/gallery/gallery16.jpg', thmb : 'img/gallery/thmb/gallery16.jpg', alt : 'Felis id lacus', fit : 'cover', title : "Felis id lacus", description: "class aptent taciti sociosqu ad litora torquent per."}, {image : 'img/gallery/gallery17.jpg', thmb : 'img/gallery/thmb/gallery17.jpg', alt : 'Ut non lobortis', fit : 'cover', title : "Ut non lobortis", description: "phasellus id volutpat neque, ut malesuada erat."}, {image : 'img/gallery/gallery18.jpg', thmb : 'img/gallery/thmb/gallery18.jpg', alt : 'At lobortis massa', fit : 'cover', title : "At lobortis massa", description: "curabitur porta risus et consectetur consectetur."}, {image : 'img/gallery/gallery19.jpg', thmb : 'img/gallery/thmb/gallery19.jpg', alt : 'Id luctus enim', fit : 'cover', title : "Id luctus enim", description: "interdum et malesuada fames ac ante ipsum primis. "}, {image : 'img/gallery/gallery20.jpg', thmb : 'img/gallery/thmb/gallery20.jpg', alt : 'Quisque in ante ut', fit : 'cover', title : "Quisque in ante ut", description: "donec nec facilisis erat, sed porttitor odio."} ]; $('body').fs_gallery({ fx : 'fade', /*fade, zoom, slide_left, slide_right, slide_top, slide_bottom*/ slide_time : 5500, /*This time must be < then time in css*/ slides : gallery_set }); </script> <script src="http://code.jquery.com/ui/1.10.2/jquery-ui.min.js" type="text/javascript"></script> <script type="text/javascript" src="js/theme.js"></script> <div class="header2top"></div> </body> </html> Cumps.
yoda Posted September 25, 2013 at 08:41 PM Report #525999 Posted September 25, 2013 at 08:41 PM http://www.w3schools.com/cssref/pr_pos_z-index.asp before you post, what have you tried? - http://filipematias.info sense, purpose, direction
vtsokalo Posted September 25, 2013 at 09:14 PM Author Report #526009 Posted September 25, 2013 at 09:14 PM http://www.w3schools.com/cssref/pr_pos_z-index.asp Após algumas tentativas, consegui. Muito obrigado. 😉
Pivot Posted October 4, 2013 at 05:06 PM Report #527662 Posted October 4, 2013 at 05:06 PM Aconselho-te a fazeres o seguinte nos inputs do formulário: <input type="text" id="user" required> Assim escusas de ter código javascript adicional para a verificação dos campos, se já estão ou não preenchidos. Abraço, Rafael.
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now