Imagen jquery que aparece automaticamente al entrar a una web

JinSunMi · #1 (**permalink**) 31/08/2012, 21:00

hola amigos
Estoy haciendo una web para una disco y me piden que una imagen tipo jquery aparezca en forma automatica (sin click) a la web, delante de la pagina y de una pelicula flash y esto es para poner la imagen de un flyer de eventos y una vez que se cierra hacienco click en una X o fuera de la imagen, ver el contenido de la web

Espero haberme explicado bien
y de ser posible los links jquery para descarga
gracias por su ayuda

Jin

Aqui les dejo un ejemplo, solo que yo tengo una pelicula flash dentro del index y quiero que aparezca el flayer tal como aqui http://www.pacha.com/

YYs86 · #2 (**permalink**) 01/09/2012, 03:45

El mostrarla es bastante fácil,

con una simple llamada a una función desde tu página pp que sea tipo:

Código Javascript:

Ver originalfunction publiPP(){
 
$('body').append('<div class="tucapa"><a href="javascript:void(0)" onclick="$(\".tucapa\").remove();return false;">[x]</a> <a href=""><img src="xxxx"></a></div>');
 
}

Lo más "complicado" es guardar en una variable que ya ha sido mostrado para esa persona y que no vuelva a aparecer hasta que pase cierto tiempo o cierre el navegador...

JinSunMi · #3 (**permalink**) 01/09/2012, 07:40

Yo desarrollo webs como segunda pasión porque soy estudiante de veterinaria aunque también más adelante llevaré cursos ya de informática, conozco de flash y php pero el jquery es todavía nuevo para mi

sé que tengo que descargarlo, ponerle links a los css y js y hasta donde alcanzan mis conocimientos, una función ¿se ejecuta sólo con click? y no me había dado cuenta pero si tienes razón, la foto no debe aparecer a cada momento

Perdonen mi atrevimiento, pero lo necesito más detallado, explicado please

YYs86 · #4 (**permalink**) 01/09/2012, 11:03

Así es como tienen declaradas las funciones en la propia página que has puesto tu de ejemplo:

Código Javascript:

Ver originalfunction launchPopup(){
centerPopup();
loadPopup();
}
//loading popup with jQuery
function loadPopup(){
//loads popup only if it is disabled
if(popupStatus==0){
$("#backgroundPopup").css({"opacity": "0.7"});
$("#backgroundPopup").fadeIn("slow");
$("#popupModal").fadeIn("slow");
popupStatus = 1;
}
}
//disabling popup with jQuery
function disablePopup(){
//disables popup only if it is enabled
if(popupStatus==1){
$("#backgroundPopup").fadeOut("slow");
$("#popupModal").fadeOut("slow");
popupStatus = 0;
}
}
//centering popup
function centerPopup(){
//request data for centering
var windowWidth = document.documentElement.clientWidth;
var windowHeight = document.documentElement.clientHeight;
var popupHeight = $("#popupModal").height();
var popupWidth = $("#popupModal").width();
//centering
$("#popupModal").css({
"position": "absolute",
"top": windowHeight/2-popupHeight/2,
"left": windowWidth/2-popupWidth/2
});
//only need force for IE6
$("#backgroundPopup").css({
"height": windowHeight
});
}

Las funciones pueden ser lanzadas por cualquier evento que tu quieras, ya sea un click(), un mouseover(), mouseenter(), keydown(),...

Tal y como lo tienen ellos declarado tienen encerrada la llamada a la función que crea el popup en un $(document).ready()...

JinSunMi · #5 (**permalink**) 02/09/2012, 08:33

Gracias
pero no me resultó

es que como dije soy nueva en el jquery
lo que necesito es un paso a paso
help me

Jin

JinSunMi · #6 (**permalink**) 03/09/2012, 12:32

hellooo alguien que me pueda dar una mano?

Dradi7 · #7 (**permalink**) 03/09/2012, 12:55

Primero en donde has puesto ese codigo mira paso a paso la estructura de tu pagina debe ser algo asi

Código HTML:

Ver original<html>
<head>
<!-- AQUI VAN TUS CSS-->
</head>
<body>
</body>
<!-- AQUI VAN TUS JAVASCRIPT -->
</html>

JinSunMi · #8 (**permalink**) 06/09/2012, 09:40

Muchas gracias
lo hice en flash aunque sé que debería hacerlo en jquery por lo de los móviles, pero no me dieron resultado lo que me sugieren aqui

Si alguien me ayuda aún, será bienvenido

JinSunMi · #9 (**permalink**) 07/09/2012, 09:48

¿alguien que me de una mano?
necesito que la foto emerga en la pantalla sin hacer click. apenas al ingresar

Dradi7 · #10 (**permalink**) 07/09/2012, 10:45

podrias usar lo siguiente

Esto va dentro del body de tu html

Código HTML:

Ver original<div id="popup">HOLA</div>

Código Javascript:

Ver original$(document)&#8203;.ready(function(){
    var p = $('#popup');
    p.css({
        width: '500px',
        height: '500px',
        backgroundColor: 'red',
        position: 'absolute',
        display: 'none'
    });
 
    // ABRIMOS EL POPUP LUEGO DE CIERTOS SEGUNDOS EN EL CASO 2 SEGUNDOS
    setTimeout(function(){
        var p = $('#popup');
        p.css({
            left: (window.screen.height + $(this).height())/2 + 'px',
            top: (window.screen.width + $(this).width())/2 + 'px',
            display: 'block'
        });
    },2000);
});&#8203;