Tema: Slideshow de imagenes
Ver Mensaje Individual
  #2 (permalink)  
Antiguo 18/10/2011, 00:56
Avatar de morfasto
morfasto
 
Fecha de Ingreso: julio-2011
Ubicación: Lima
Mensajes: 291
Antigüedad: 12 años, 9 meses
Puntos: 8
Respuesta: Slideshow de imagenes
Este es el codigo completo, por si hay alguna duda:
Código HTML: 
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <link href="global.css" rel="stylesheet" type="text/css" media="screen" />
  6. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
  7. <script src="js/slides.jquery.js"></script>
  8. <script type="text/javascript" language="javascript">
  9.    var http_request = false;
  10.    function makePOSTRequest(url, parameters, funcion) {
  11.       http_request = false;
  12.       if (window.XMLHttpRequest) { // Mozilla, Safari,...
  13.          http_request = new XMLHttpRequest();
  14.          if (http_request.overrideMimeType) {
  15.             // set type accordingly to anticipated content type
  16.             //http_request.overrideMimeType('text/xml');
  17.             http_request.overrideMimeType('text/html');
  18.          }
  19.       } else if (window.ActiveXObject) { // IE
  20.          try {
  21.             http_request = new ActiveXObject("Msxml2.XMLHTTP");
  22.          } catch (e) {
  23.             try {
  24.                http_request = new ActiveXObject("Microsoft.XMLHTTP");
  25.             } catch (e) {}
  26.          }
  27.       }
  28.       if (!http_request) {
  29.          alert('Cannot create XMLHTTP instance');
  30.          return false;
  31.       }
  32.       
  33.       http_request.onreadystatechange = funcion;
  34.       http_request.open('POST', url, true);
  35.       http_request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  36.       http_request.setRequestHeader("Content-length", parameters.length);
  37.       http_request.setRequestHeader("Connection", "close");
  38.       http_request.send(parameters);
  39.    }
  40.  
  41.    function alertContents() {
  42.       if (http_request.readyState == 4) {
  43.          if (http_request.status == 200) {
  44.             //alert(http_request.responseText);
  45.             result = http_request.responseText;
  46.             document.getElementById('slides_container').innerHTML = result;            
  47.          } else {
  48.             alert(http_request.status);
  49.          }
  50.       }
  51.    }
  52.    
  53.    function get() {
  54.       var poststr = "eventos=" + encodeURI( document.getElementById("eventos").value );
  55.       makePOSTRequest('eventos.php', poststr, alertContents);
  56.    }
  57. </script>
  58. <script>
  59.     $(function(){
  60.         $('#slides').slides({
  61.             preload: true,
  62.             preloadImage: 'img/loading.gif',
  63.             play: 5000,
  64.             pause: 2500,
  65.             hoverPause: true
  66.         });
  67.     });
  68. </script>
  69. </head>
  70. <body>
  71. <div id="slides">
  72.     <div class="slides_container">
  73.         <a href="#" target="_blank"><img src="1.png"></a>
  74.         <a href="#" target="_blank"><img src="2.png"></a>
  75.         <a href="#" target="_blank"><img src="3.png"></a>
  76.         <a href="#" target="_blank"><img src="4.png"></a>
  77.         <a href="#" target="_blank"><img src="5.png"></a>
  78.     </div>
  79. </div>
  80. <select name="eventos" id="eventos" onchange="javascript:get();">
  81.     <option value=""> Elegir Evento:</option>
  82.     <option value="1">Evento 1</option>
  83.     <option value="2">Evento 2</option>
  84. </select>
  85.  
  86. </body>
  87. </html>

eventos.php
Código PHP:
<?php
$eventos=$_POST['eventos'];
if($eventos==1){
echo    "<a href='#' target='_blank'><img src='6.png'></a>"
        ."<a href='#' target='_blank'><img src='7.png'></a>";
}elseif($eventos==2){
echo    "<a href='#' target='_blank'><img src='8.png'></a>"
        ."<a href='#' target='_blank'><img src='9.png'></a>"
        ."<a href='#' target='_blank'><img src='10.png'></a>";
}
?>