modales para llamara la atención en la interfaz del usuario anno.js

DESCARGA : anno.js

modales para llamara la atención en la interfaz del usuario, anno.js es una gran plugin ya que tiene como objetivo mostrar contenido en todo una aplicación o sitio mostrando un modal y mostrando solo un determinado contenido, lo interesante de este plugin es que muestra información dependiendo del id referenciado en el código, este plugin te permite cambiar el tamaño del modal presentado mediante los atributos “position:”, ademas que te permite implementar mucho más modales que podrían ser implementados en una bienvenida, al igual que otros códigos te permite generar botones de siguiente y atrás, con le objetivo de poder generar también un wizard de aplicaciones.

El plugin cuenta con los siguientes ejemplos:

1.- Uso básico.
2.- Posición y tamaño del modal.
3.- Botones en el modal.
4.- Mostrar y ocultar.
5.- Modal en Botstrap Modal.
6.- Modal dentro de un los scroll.
7.- Modificación de evento.

Por ejemplo en uno de los códigos se puede ver el manejo de contenido html dentro del modal:

var anno9 = new Anno({
  target: '#region9',
  content: "<code>#button1</code> is disabled, but <code>#button2</code> still works.",
  className: 'anno-width-400',
  onShow: function (anno, $target, $annoElem) {
    var handler = function(e){
      if(e.target.id === 'button1') e.stopPropagation() // filters out #button1
    }
    $target[0].addEventListener('click', handler, true) // `true` is essential
    return handler
  },
  onHide: function(anno, $target, $annoElem, handler) {
    $target[0].removeEventListener('click', handler, true)
  }
})

Aquí en este enlace, puedes encontrarte con mucho más ejemplos:http://iamdanfox.github.io/anno.js/

 

You may also like...