Ver Mensaje Individual
  #1 (permalink)  
Antiguo 31/10/2012, 16:11
kmilo9607
Usuario no validado
 
Fecha de Ingreso: julio-2012
Ubicación: Cali
Mensajes: 44
Antigüedad: 11 años, 9 meses
Puntos: 0
Exclamación Quien me puede ayudar a modificar la posicion de mi popup

Hola
tengo una pagina que la estoy realizando con Dreamweaver...le coloque un popup con jquery que me funciona ala perfeccion..pero quiero modificarle su posicion quiero acomodar la posición vertical para que no se vea centrada al tamaño de la pagina ya que quiero que se vea un poquito mas abajo de la parte superior del navegador.

Este es el javascript
Código:
<script src="http://jqueryjs.googlecode.com/files/jquery-1.2.6.min.js" type="text/javascript"></script>
<script type="text/javascript">
//Configuramos el evento de carga de página, se ejecuta solamente 1 vez cuando la página cargo por completo
$(document).ready(function(){
  centraVentana();
  muestraVentana();
  //Agregamos el evento "click" del div: ventanaPopup1Cerrar
  $("#ventanaPopup1Cerrar").click(function(){
    ocultaVentana();
  });
  //Agregamos el evento "click" del div: ventanaPopup1Fondo
  $("#ventanaPopup1Fondo").click(function(){
    ocultaVentana();
  });
});
 
function centraVentana() {
    //Obtenemos ancho y alto del navegador, y alto y ancho de la popUp
    var windowWidth = document.documentElement.clientWidth;
    var windowHeight = document.documentElement.clientHeight;
    var popupHeight = $("#ventanaPopup1").height();
    var popupWidth = $("#ventanaPopup1").width();
    //centering
    $("#ventanaPopup1").css({
        "position": "absolute",
        "top": windowHeight/2-popupHeight/2,
        "left": windowWidth/2-popupWidth/2
    });
 
    //Solo se necesita para IE6
    $("#ventanaPopup1Fondo").css({
        "height": windowHeight
    });
}
 
function ocultaVentana() {
    $("#ventanaPopup1Fondo").fadeOut("slow");
    $("#ventanaPopup1").fadeOut("slow");
}
 
function muestraVentana() {
    $("#ventanaPopup1Fondo").css({
        "opacity": "0.7"
    });
    $("#ventanaPopup1Fondo").fadeIn("slow");
    $("#ventanaPopup1").fadeIn("slow");
}
</script>
y este es el estilo
Código:
<style type="text/css">
#ventanaPopup1Fondo{
display:none;
position:fixed;
_position:absolute; /* caso especial para IE 6*/
height:100%;
width:100%;
top:0;
left:0;
background:#000000;
border:1px solid #cecece;
z-index:1;
}
#ventanaPopup1{
display:none;
position:absolute;
_position:absolute; /* caso especial para IE 6*/
height:540px;
width:716px;
background:#FFFFFF;
border:2px solid #cecece;
z-index:2;
padding:12px;
font-size:13px;
}
#ventanaPopup1Cerrar{
font-size:14px;
line-height:14px;
right:6px;
top:4px;
position:absolute;
color:#6fa5fd;
font-weight:700;
display:block;
}
</style>