Mostrar/ocultar imagen en un FX

Home Forums Ayuda / Ajuda / Laguntza / Axuda / Help Mostrar/ocultar imagen en un FX

This topic contains 8 replies, has 2 voices, and was last updated by  PacoRuiz 1 week, 3 days ago.

  • Author
    Posts
  • #30163

    PacoRuiz
    Member

    Hola. Una duda.

    Dentro de un “Efecto (FX)” quiero poner un botón, enlace o similar, tal que al pulsarlo muestre/oculte una imagen. Algo parecido al botón de retroalimentación de un “Caso práctico”.

    ¿Cómo podría hacerlo?

    Gracias

  • #30164

    Ignacio Gros
    Member

    Adjunto ejemplo.

    En la página “Uno” pongo el ejemplo metiendo el HTML completo en el TinyMCE.

    En la “Dos”, el ejemplo con código más limpio (dejando todo el JavaScript) en Propiedades – Pie de página.

    Espero que te sirva.

    Saludos.

    Archivos adjuntos:
    You must be logged in to view attached files.
  • #30170

    PacoRuiz
    Member

    El ejemplo adjunto me aparece vacío, ni siquiera JAvaScrit en Pie de Página

    • #30171

      Ignacio Gros
      Member

      Adjunto un ejemplo creado con eXeLearning 2.2 y abro incidencia para intentar solucionar el problema de compatibilidad entre versiones.

      Saludos.

      Archivos adjuntos:
      You must be logged in to view attached files.
  • #30173

    PacoRuiz
    Member

    Anoto lo que me mandas porque seguro que lo voy a utilizar, pero no era lo que quería en este momento.

    Creo que no me expliqué bien.
    Busco un enlace (o botón) simplemente que al pulsarlo muestre/oculte una imagen, solo eso. Inicialmente debe aparecer oculta.
    (No sé si hay ya una opción para ello que desconozca)

    Comentaba que esto podría apañarlo con el iDevice “Caso práctico”.
    Pero como quiero utilizarlo dentro de un FX con paginación (se me olvidó indicar esto), ahí no sé cómo meter ese iDevice.

    He probado a tomar parte del código html de “Caso práctico” e introducirlo “por la cara” en el FX y me funciona en la primera página, en el resto no.

    • #30178

      Ignacio Gros
      Member

      Hola Paco:

      Lo siento, pero es que sigo entendiendo lo mismo que la otra vez.

      > Busco un enlace (o botón) simplemente que al pulsarlo muestre/oculte una imagen, solo eso. Inicialmente debe aparecer oculta.

      En en el ejemplo, es el enlace con el texto “Enlace que se muestra sólo si JS está habilitado”. La imagen estaría donde está el párrafo que dice “Este es el párrafo que está oculto por defecto…”. ¿No serviría eso?

      Si lo que prefieres es mostrar una imagen en un Lightbox, es suficiente con que añadas un enlace a la imagen y le añadas rel="lightbox" a la etiqueta a. Ejemplo: <a href="..." rel="lightbox" title="Título que se muestra">Enlace</a>

      > Pero como quiero utilizarlo dentro de un FX con paginación (se me olvidó indicar esto), ahí no sé cómo meter ese iDevice.

      El ejemplo que te pasé funciona en cualquier sitio: para pasar de acordeón a paginación no tienes más que colocarte en el bloque, hacer clic en FX y cambiar el tipo. También puedes cambiar exe-accordion por exe-paginated en el código HTML.

      Si lo que digo no tiene sentido, ¿me puedes pasar un pantallazo o un ejemplo (aunque no funcione)?

  • #30182

    PacoRuiz
    Member

    Tengo la impresión de que lo que pido es muy simple pero al explicarlo lo complico.

    Te mando un ELP con un par de líneas de texto y una imagen.

    Lo único que querría es que la imagen saliera oculta por defecto (solo esa, podría haber más imágenes sin ninguna relación),
    y que al pinchar en ENLACE se mostrara.

    Solo eso

    Archivos adjuntos:
    You must be logged in to view attached files.
    • #30184

      Ignacio Gros
      Member

      Lo adjunto. El código es similar al del ejemplo anterior.

      Verás que hay clases CSS:

      js-required para el contenido que se muestra únicamente si JavaScript está habilitado.
      js-hidden para el contenido oculto cuando JavaScript está habilitado.

      Eso está especificado en base.css

      Si quieres hacer algo más sencillo (pero menos accesible), puedes usar display:none. Ese ejemplo está en la página “Dos”.

      Espero que te sirva.

      Archivos adjuntos:
      You must be logged in to view attached files.
  • #30187

    PacoRuiz
    Member

    EDITADO

    Resuelto todo. Puse mi imagen y desaparece y aparece

    Gracias por tu paciencia Ignacio

    Un saludo

     

    ——————

    En la página Dos tomas una imagen online.

    ¿Cómo lo haría para usar una imagen dentro del propio elp?

    • This reply was modified 1 week, 3 days ago by  PacoRuiz.

You must be logged in to reply to this topic.