- Incluir iframe.js (NO requiere Jquery)
<script type="text/javascript" src="iframe.js" ></script>
-
Cerrar el modal
<script> iframeMessenger.post("close"); </script>
-
Remover boton cerrar (cruz)
<script> iframeMessenger.post("remove=close"); </script>
-
Remover Loading
<script> iframeMessenger.post("remove=loading"); </script>
-
Agregar Loading
<script> iframeMessenger.post("add=loading"); </script>
</li> <li> <p>Resizear con animacion (ancho, alto, animacion,velocidad)</p> <pre style="word-wrap: break-word; white-space: pre-wrap;"> <script> iframeMessenger.post("resize=330&250&true&1400"); </script></pre> </li> <li> <p>Resizear sin animacion (ancho,alto)</p> <pre style="word-wrap: break-word; white-space: pre-wrap;"> <script> iframeMessenger.post("resize=400&300"); </script></pre> </li>
Deben tener los siguientes atributos:
- class="iframe-modal"
- Selector para identificar si tiene que abrir modal.
<dt>data-modal:width="number"</dt>
<dd>Define el ancho del modal</dd>
<dt>data-modal:height="number"</dt>
<dd>Define el alto del modal</dd>
<dt>data-modal:url="string"</dt>
<dd>Es la URL que se mostrará en el iframe</dd>
<dt>data-modal:dinamic="boolean"</dt>
<dd>Determina si ese modal recibira mensajes. Valores: true || false</dd>
<a href="http://mercadolibre.com.ar" target="_blank" class="iframe-modal" data-modal:width="300" data-modal:height="400" data-modal:url="http://www.mercadolibre.com.ar" data-modal:dinamic="true">Link</a>
- Incluir parent.js (requiere Jquery + ChicoUI)
<script type="text/javascript" src="parent.js" ></script>
- Instanciar los componentes:
<pre style="word-wrap: break-word; white-space: pre-wrap;">
<script> iframeMessageCallback.init(); iframeModal.init(iframeMessageCallback); </script>
Por default se reconocen los 6 mensajes ya explicados. Para escuchar mas mensajes, pueden crearlos con el método "bind" del componente iframeMessageCallback
<script> iframeMessageCallback.bind('seLogueo',function() { alert("se logueo"); }) </script>