¿Algún experto en desarrollo web me puede ayudar?

Archivado
Muy buenas.

Resulta que tengo una web sobre Destiny montando con Wordpress, y quería saber como conseguir lo siguiente. Por ejemplo, en la web oficial de Bungie al pasar el puntero del ratón aparece una ventana emergente https://www.bungie.net/es/Armory/Category?order=3&dir=2&categories=20%2C22 con las estadísticas del arma como adjunto en el fichero.

Me gustaría implantarlo en mi web, quien este o sepa como desarrollarlo, le estaría agradecido si me ayudara o me guiara un poco.
Un saludo.

Adjuntos

pantallazo.jpg (84.79 KB)

ventana emergente
Lo que necesitas es un Pop Up y yo utilizaría Jquery, puedes programarlo tú mismo o coger alguna herramienta ya creada, como por ejemplo http://demos.jquerymobile.com/1.3.0-rc.1/docs/demos/widgets/popup/
QuiNtaN escribió:Lo que necesitas es un Pop Up y yo utilizaría Jquery, puedes programarlo tú mismo o coger alguna herramienta ya creada, como por ejemplo http://demos.jquerymobile.com/1.3.0-rc.1/docs/demos/widgets/popup/


Muchas gracias, lo he revisado pero desconozco como programar el Pop Up con las estadísticas y la imagen como adjunte en el primer mensaje, no se si me explico bien.

Un saludo.
Básicamente, bajas jquery, lo incluyes en la pagina donde quieras usarlo, controla el evento hover del elemento(cuando pasas por encima) y entonces sacas un popup. Hablando a groso modo.
A mí me parece que el problema no es el popup, sino el contenido del popup que el OP quiere que el componente sea dinámico y no sólo una imagen.
Con jQuery controlas el evento hover, como ya te han dicho, y entonces llamas a esta funcion pasandole como parametro algo que te identifique el arma de la que quieres mostrar las estadisticas

$.ajax({
        url: "url que carga los datos de las estadisticas",
        cache: false,
        success: function (html) {
            //pintas el contenido en el pop up
            $('.divPopUp').html(html);
        },
        error: function (html) {
       //muestras mensaje de error
       $('.divPopUp').html('Se ha producido un error');
        }
    });


Por ejemplo, llamas a la página datos_de_arma.php?id_arma=40 en el parámetro url, y en esa página pintas lo que quieres que salga en el popup.
Usa javascript y ajax si quieres hacerlo a pelo. Colocas el div donde te interese, le metes un display none y un evento onhover en la imagen del arma.

La funcion llamada en el onhover hara que el div sea visible, con un document.getElementById("eldiv").style.display='none'

Perdona por si me explique mal pero estoy desde el movil.
Ajax :-? :-?
Eso es un tooltip y existen plugins que hacen eso. Busca "tooltip jquery" en google y elige el que mas te guste. Tendrás que bajarte la librería y mirar como se utiliza. En la propia web te lo dirá como hacerlo.
La cosa es que como tienes un wordpress, si no hay un plugin que te haga eso tan específico, vas a tener que tocar código y no es tan fácil para explicarte en un par de post por aquí...
Gracias a todos por vuestras respuesta. Por lo que veo no es algo tan sencillo [buuuaaaa] , lo dejare de momento.

Un saludo.
9 respuestas
Archivado
Volver a General