Estoy haciendo una web en flash, sin embargo, quiero hacer un formulario de contacto que funciona con php, y quiero que se vea utilizando ColorBox (jQuery Lightbox).
¿Cómo puede activarse un colorbox desde un botón dentro de un swf?
Espero puedan ayudarme, muchas gracias.
PD: Estoy trabajando con AS2,un ejemplo de lo que quiero lograr se ve en esta web: http://www.trauma.com.ve/flash/index.html, si le dan a CONTACTO podrán ver de lo que hablo.
PD2: hice mi intento utilizando ColorBox (jQuery Lightbox), pero no funciona bien, en http://lalonchera.netau.net/ al presionar el recuadro gris pueden ver que el colorbox no se abre encima del .swf sino por debajo; en InternetExplorer es aún peor, niquiera sale el iFrame centrado y también sale por debajo.
Para esta prueba hice lo siguiente:
1. En el documento .fla coloqué este código:
Código ActionScript :
bt.onRelease = function (){ getURL("javascript:SWFDelegate('contacto.html');"); }
donde "bt" es el nombre de instancia del cuadro gris.
Publiqué esto como html y ese html lo modifiqué como dice el paso 2.
2. En el html que me dió flash, después de la etiqueta <title></title> coloqué el siguiente código:
Código HTML :
<script type="text/javascript" src="includes/swfobject.js"></script> <link type="text/css" media="screen" rel="stylesheet" href="css/index.css" /> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript" src="jquery.colorbox.js"></script> <script language="JavaScript" type="text/JavaScript"> <!-- function SWFDelegate(url,iwidth,iheight,caption) { $.fn.colorbox({iframe:true, href:url, width:392, height:385}); } //--> </script>
3. El documento "index.css" al cual responde el html contiente este código (que es el código del colorbox):
Código C++ :
@charset "utf-8"; /* CSS Document */ /* CSS GENERAL */ body {background-color: #ffcc00;} * { margin: 0; padding: 0;} img { border: none;} /* ColorBox Core Style The following rules are the styles that are consistant between themes. Avoid changing this area to maintain compatability with future versions of ColorBox. */ #colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;} #cboxOverlay{position:fixed; width:100%; height:100%;} #cboxMiddleLeft, #cboxBottomLeft{clear:left;} #cboxContent{position:relative; overflow:visible;} #cboxLoadedContent{overflow:auto;} #cboxLoadedContent iframe{display:block; width:100%; height:100%; border:0;} #cboxTitle{margin:0;} #cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;} #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;} /* ColorBox example user style The following rules are ordered and tabbed in a way that represents the order/nesting of the generated HTML, so that the structure easier to understand. */ #cboxOverlay{ background-image:url(../images/bg_cont.jpg)} /*color del overlay*/ #colorbox{} #cboxContent{margin-top:0px;} /*para el borde de encima del cuadro*/ #cboxContent{margin-bottom:0px;} /*para el borde debajo del cuadro*/ #cboxLoadedContent{background:#ffcc00; padding:20px;} /*para el relleno del cuadro, el padding es borde*/ #cboxLoadingGraphic{background:url(images/loading.gif) center center no-repeat;} /*para el cargando, debe ser gif animado*/ #cboxLoadingOverlay{background:#ffcc00;} /*el fondo del cuadro cuando se está cargando*/ #cboxTitle{position:absolute; top:0px; left:0; color:#ffcc00;} /*para la posición del caption de las fotos, el margin-top debe modificarse acorde si el texto va arriba, el bottom si está abajo*/ #cboxCurrent{position:absolute; top:0x; right:0px; text-indent:-9999px;} /*no se*/
4. La página "contacto.html" que es la que se abre al presionar el botón gris contiene el formulario y responde a "contacto.php" que tiene el siguiente código:
Código PHP :
<?php $to = "[email protected]"; $subject = "Contacto desde rqdisena.com"; $email = $_REQUEST['Email'] ; $message = $_REQUEST['Nombre'].": ".$_REQUEST['Mensaje'] ; $headers = "From: $email"; $sent = mail($to, $subject, $message, $headers) ; if($sent) {print "Su mensaje ha sido enviado."; } else {print "Ha ocurrido un error, intente enviar el mensaje de nuevo."; } ?>