Publicado em 14 de jul.

Javascript com Jquery

Pessoal,

Estou criando um site para meu primo, e logo no inicio coloquei uma animação de slides com fotos, após coloquei um popup para cadastro de emails, porém o popup só fica por trás da animação.

Alguém consegue me ajudar como eu deixo o popup sempre visível?

<!DOCTYPE html>

<html lang="pt-br">
	<head>
	<title>Gean Ramos</title>
	<meta charset="utf-8">
	<link rel="icon" href="img/favicon.ico" type="image/x-icon">
	<link rel="shortcut icon" href="img/favicon.ico" type="image/x-icon" />
	<meta name="description" content="Your description">
	<meta name="keywords" content="Your keywords">
	<meta name="author" content="Your name">
	<link rel="stylesheet" href="css/bootstrap.css" type="text/css" media="screen">
	<link rel="stylesheet" href="css/responsive.css" type="text/css" media="screen">
	<link rel="stylesheet" href="css/style.css" type="text/css" media="screen">
	<link rel="stylesheet" href="css/touchTouch.css" type="text/css" media="screen">
	<link rel="stylesheet" href="css/kwicks-slider.css" type="text/css" media="screen">
	<link href='[http://fonts.googleapis.com/css?family=Open+Sans:400,300'](http://fonts.googleapis.com/css?family=Open+Sans:400,300) rel='stylesheet' type='text/css'>
	<script type="text/javascript" src="js/jquery.js"></script>
 <script type="text/javascript" src="js/superfish.js"></script>
	<script type="text/javascript" src="js/jquery.flexslider-min.js"></script>
	<script type="text/javascript" src="js/jquery.kwicks-1.5.1.js"></script>
	<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
	<script type="text/javascript" src="js/touchTouch.jquery.js"></script>
	<script type="text/javascript">if($(window).width()>1024){document.write("<"+"script src='js/jquery.preloader.js'></"+"script>");}	</script>

	<script>
 jQuery(window).load(function() {
 $x = $(window).width();
	if($x > 1024)
	{
	jQuery("#content .row").preloader(); }

 jQuery('.magnifier').touchTouch();
 jQuery('.spinner').animate({'opacity':0},1000,'easeOutCubic',function (){jQuery(this).css('display','none')});
 });

	</script>
 </head>

	<body>
 <div class="spinner"></div>

 <!-- NEWSLETTER EMAIL -->

 <style type="text/css">
	#topbar
	{
	padding: 5px 5px 5px 5px;
	visibility: hidden;
	border: black 1px solid;
	width: 340px;
	font-family: Tahoma;
	position: absolute;
	background-color: white
	}
	</style>
	<script type="text/javascript">
 var persistclose = 0
 var startX = 5
 var startY = 5
 var verticalpos = "frombottom"

 function iecompattest()
 {
 return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
 }

 function get_cookie(Name)
 {
 var search = Name + "="
 var returnvalue = "";
 if (document.cookie.length > 0)
 {
 offset = document.cookie.indexOf(search)
 if (offset != -1)
 {
 offset += search.length
 end = document.cookie.indexOf(";", offset);
 if (end == -1) end = document.cookie.length;
 returnvalue=unescape(document.cookie.substring(offset, end))
 }
 }
 return returnvalue;
 }

 function closebar()
 {
 if (persistclose)
 document.cookie="remainclosed=1"
 document.getElementById("topbar").style.visibility="hidden"
 }

 function staticbar()
 {
 barheight=document.getElementById("topbar").offsetHeight
 var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;
 var d = document;
 function ml(id)
 {
 var el=d.getElementById(id);
 if (!persistclose || persistclose && get_cookie("remainclosed")=="")
 el.style.visibility="visible"
 if(d.layers)el.style=el;
 el.sP=function(x,y){this.style.right=x+"px";this.style.top=y+"px";};
 el.x = startX;
 if (verticalpos=="fromtop")
 el.y = startY;
 else
 {
 el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
 el.y -= startY;
 }
 return el;
 }

 window.stayTopLeft=function()
 {
 if (verticalpos=="fromtop")
 {
 var pY = ns ? pageYOffset : iecompattest().scrollTop;
 ftlObj.y += (pY + startY - ftlObj.y)/8;
 }
 else
 {
 var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;
 ftlObj.y += (pY - startY - ftlObj.y)/8;
 }
 ftlObj.sP(ftlObj.x, ftlObj.y);
 setTimeout("stayTopLeft()", 10);
 }
 ftlObj = ml("topbar");
 stayTopLeft();
 }

 if (window.addEventListener)
 window.addEventListener("load", staticbar, false)
 else if (window.attachEvent)
 window.attachEvent("onload", staticbar)
 else if (document.getElementById)
 window.onload=staticbar
 </script>

 <div id="topbar">
 <a href="javascript:closebar();">
 <p></p>
 <!-- FORMULARIO -->
 <form method="POST" action="http://www.geanramos.net.br/news/email.php" target="_blank">
 <p align="right"><font face="Arial" size="2">
 <input type="button" id="botao" value=" X " onClick="MM_showHideLayers('fechada','','hide')" title="Fechar!!!">
 </font></p></a>
 <center><p><b>Receba novidades de shows em seu e-mail</b></p></center>
 <p><font face="Arial" size="2">E-mail:

 <input type="text" name="e-mail" size="24" style="font-family: Arial; font-size: 8 pt; background-color: #C0C0C0; border-style: solid; border-width: 1">
 <input type="submit" value="OK" style="font-family: arial; font-size: 10 pt; background-color: #C0C0C0; border: 1 solid #000000"><br>
 <center><input type="radio" value="assinar" name="opcao" checked>Assinar
 <!-- <input type="radio" name="opcao" value="remover">Remover --> </font></p></center>
 </form>
 </div>

<header>
 <div class="container clearfix">
 <div class="row">
 <div class="span12">
 <div class="navbar navbar_">
 <div class="container">
 <h1 class="brand brand_"><a href="index.html"><img alt="" src="img/logo.gif"> </a></h1>
 <a class="btn btn-navbar btn-navbar_" data-toggle="collapse" data-target=".nav-collapse_">Menu <span class="icon-bar"></span> </a>
 <div class="nav-collapse nav-collapse_ collapse">
 <ul class="nav sf-menu">
 <li class="active"><a href="index.html">Home</a></li>
 <li class="sub-menu"><a href="index-1.html">Agenda</a>
 <!-- <ul>
 <li><a href="#">Dolore </a></li>
 <li><a href="#">Consecte</a></li>
 <li><a href="#">Conseq</a></li>
 </ul> -->
 </li>
 <li><a href="index-2.html">Galeria</a></li>
 <li><a href="index-3.html">Biografia</a></li>
 <li><a href="index-4.html">Contato</a></li>
 </ul>
 </div>
 </div>
 </div>
 </div>
 </div>
 </div>
 </header>
<div class="bg-content">
 <div class="container">
 <div class="row">
 <div class="span12">
 <!--============================== slider =================================-->
 <div class="flexslider">
 <ul class="slides">
 <li> <img src="img/slide-1.jpg" alt="" > </li>
 <li> <img src="img/slide-2.jpg" alt="" > </li>
 <li> <img src="img/slide-3.jpg" alt="" > </li>
 <li> <img src="img/slide-4.jpg" alt="" > </li>
 <li> <img src="img/slide-5.jpg" alt="" > </li>
 </ul>
 </div>
 <span id="responsiveFlag"></span>
 <div class="block-slogan">
 <h2>Música</h2>
 <div>
 <p><a href="[http://www.geanramos.com.br](http://www.geanramos.com.br) " target="_blank" class="link-1">Gean Ramos</a>, cantor, compositor e violonista, é uma revelação da musica nordestina.

Com seu violão pegou a estrada desde muito cedo e morou em diversas cidades brasileiras. O pernambucano traz em sua musica a forte essência e tempero brasileiro.
Gravou seu primeiro EP em 2001, o primeiro CD em 2008, e esta agora divulgando e fazendo shows do seu mais novo trabalho; O DVD Trajetória, que faz uma leitura da sua historia musical que completa quatorze anos.

Influenciado pela musica brasileira é fácil se identificar com a mistura de sons que a musica de Gean Ramos tem, o samba o maracatu, o choro além de outros ritmos que ele une com muita personalidade.</p>
 </div>
 </div>
 </div>
 </div>
 </div>

Discussão (3)

Entre ou cadastre-se para participar da discussão

Entrar Criar conta

Carregando comentários...