Outbook

HTML+CSS+JS, Accesibilidad, PHP y más

Datos de búsqueda

Archive for Agosto, 2009

DVB-T USB en Mandriva 2009

Fecha de publicación: 2009/08/26

Parece que hay dispositivos de TDT que parecen no funcionar en Mandriva 2009.1, que curiosamente en Ubuntu 8.04 si que funcionaban sin tener que hacer nada. La solución está en bajarse e instalar el firmware.

Y si se usa Kaffeine, habrá que instalar phono-xine para que termine de funcionar.

Datos del artículo:

Mandriva 2009.1 Spring: password en MySQL

Fecha de publicación: 2009/08/17

Antes de utilizar el servidor MySQL parece que hay que crear el password. Ejecutar como superusuario:

mysqladmin -u root password sqladmin

Donde sqladmin sería el password.

Datos del artículo:

  • Etiquetas: , , ,
  • Publicado en categorías: Sin categoría
  • Comentarios desactivados en Mandriva 2009.1 Spring: password en MySQL

Javascript: Slideshow con Jquery

Fecha de publicación: 2009/08/13

Actualizado 2009-10-02: Se le añade botón de pausa (vaya fallo el no haberlo puesto anteriormente) y comentarios útiles sobre el funcionamiento de cada parte del código.

He creado un slideshow sencillo con Jquery (probado en versión 1.3.2):

jQuery.noConflict(); // Así podemos convivir con otras librerías JS como Prototype o Motools (y las que utilicen $) sin ningún conflicto

jQuery(document).ready(function(){
 var slides1 = new Slides();
  slides1.inicia();
  
 /*
 // Ejemplo de uso
 var slides1 = new Slides();
 slides1.inicia();
 slides1.caja = '#slides'; // id del contenedor de los destacados
 slides1.numero = 1; // Número de destacados que se muestran
 slides1.tiempo = 2.5; // Segundos entre cambio de destacado
 slides1.velocidadMostrar = 'fast';
 */
});

function Slides () {
 this.caja = '#slides'; // id del contenedor de los destacados
 this.slide = '.slide'; // destacado
 this.numero = 1; // Número de destacados que se muestran
 this.tiempo = 2.5; // Segundos entre cambio de destacado
 this.milisegundos = this.tiempo*1000; // No editar
 this.velocidadMostrar = 'fast';
 
 this.inicia = function () {
  
  numDestacados = jQuery(this.caja+' '+this.slide).length; // Número de destacados
  i=this.numero;
  k=0;
  
  // Se activa la primera tanda de destacados
  while (k<this.numero) {
   jQuery(this.caja+' '+this.slide).eq(k).addClass('activo');
   k++;
  }
  while (i<numDestacados) {
   jQuery(this.caja+' '+this.slide).eq(i).hide();
   i++;
  }
  
  // Se da ID a los destacados
  j=0;
  while (j<numDestacados) {
   jQuery(this.caja+' '+this.slide).eq(j).attr('id','slide-'+(j+1));
   j++;
  }
  
  this.paginacion(); // Se generan los controles de pausa y paginación
  
  // Se inicia el slideshow
  var that = this;
  this.intervalo = setInterval(function(){that.cambiar();}, this.milisegundos);
  
  // Al clicar una página se detiene el proceso y se va a la página
  jQuery('#paginadorSlide li a').click(function () {
   clearInterval(that.intervalo);
   that.controlPausar();
   that.irPagina(parseInt(jQuery(this).parent().attr('id').split('-')[1]));
   jQuery('#paginadorSlide li').removeClass('activo');
   jQuery(this).parent().addClass('activo');
   return false;
  });
  
  // Al clicar el botón de pausar/continuar se alterna detener/continuar el proceso
  jQuery('#pausarContinuar a').eq(0).click(function () {
   if (jQuery(this).hasClass('moviendo')) {
    that.controlPausar();
   } else {
    that.intervalo = setInterval(function(){that.cambiar();}, that.milisegundos);
    that.controlContinuar();
   }
   return false;
  });
  
 }
 
 // Modificar botón de pausar/reanudar
 this.controlPausar = function () {
  clearInterval(this.intervalo);
  jQuery('#pausarContinuar a').eq(0).html('Reanudar');
  jQuery('#pausarContinuar a').eq(0).removeClass('moviendo');
 }
 this.controlContinuar = function () {
  jQuery('#pausarContinuar a').eq(0).html('Pausar');
  jQuery('#pausarContinuar a').eq(0).addClass('moviendo');
 }
 
 // Cambiar de slide
 this.irPagina = function (pagina) {
  elUltimo = pagina*this.numero;
  el = (elUltimo)-this.numero;
  jQuery(this.caja+' '+this.slide).removeClass('activo');
  while (el<elUltimo) {
   jQuery(this.caja+' '+this.slide).eq(el).addClass('activo');
   jQuery(this.caja+' '+this.slide).eq(el).addClass('activo activoPausa');
   el++;
  }
  
  jQuery(this.caja+' '+this.slide+':not(.activo)').hide();
  jQuery(this.caja+' '+this.slide+'.activo').fadeIn(this.velocidadMostrar);
  
 }
 
 // Cambio automático de slide
 this.cambiar = function () {
  activos = jQuery(this.caja+' '+this.slide+'.activo').length-1;
  ultimoActivo = jQuery(this.caja+' '+this.slide+'.activo').eq(activos);
  numeroUltimoActivo = parseInt(jQuery(this.caja+' '+this.slide+'.activo').eq(activos).attr('id').split('-')[1])+this.numero;
  proximaPagina = (numeroUltimoActivo/this.numero)-1;
  numDestacados = jQuery(this.caja+' '+this.slide).length;
  
  if (numeroUltimoActivo>numDestacados) {proximoActivo=jQuery(this.caja+' '+this.slide).eq(0);proximaPagina=0;} else {proximoActivo = ultimoActivo.next(this.slide);}
  jQuery(this.caja+' '+this.slide+'.activo').removeClass('activo');
  i=0;
  while (i<this.numero) {
   proximoActivo.addClass('activo');
   proximoActivo = proximoActivo.next();
   i++;
  }
  jQuery(this.caja+' '+this.slide+':not(.activo)').hide();
  jQuery('#paginadorSlide li').removeClass('activo');
  jQuery('#paginadorSlide li').eq(proximaPagina).addClass('activo');
  jQuery(this.caja+' '+this.slide+'.activo').fadeIn(this.velocidadMostrar);
 }
 
 
 this.paginacion = function () {
  numPaginas = Math.ceil((jQuery(this.caja+' '+this.slide).length)/this.numero);
  jQuery(this.caja).after('<div id="controlesSlide"><ul class="paginadorSlide" id="paginadorSlide"></ul></div>'); // Se crea el contenedor de paginación
  jQuery('#paginadorSlide').before('<p id="pausarContinuar"><a href="#" class="moviendo">Pausar</a></p>'); // Se crea el párrafo para el botón de detener/continuar en su estado predeterminado (Pausar)
  
  i=0;j=1;
  while (i<numPaginas) {
   jQuery('#paginadorSlide').append('<li id="paginaSlide-'+j+'"><a href="#">'+j+'</a></li>');
   i++; j++;
  }
  jQuery('#paginadorSlide li').eq(0).addClass('activo');
 }
 
}

Para iniciarlo con los id y clases predeterminados:

var slides1 = new Slides();
 slides1.inicia();

En ese caso el HTML podría ser:

<div id="slides">
 <div class="slide">
  [Contenido del slide]
 </div>
 <div class="slide">
  [Contenido del slide]
 </div>
</div>

Un contenedor que lleve el id slide y elementos dentro del mismo con la clase slides.

Ver demostración o descargar el ejemplo (archivo ZIP, 348KB).

Datos del artículo:

Información del sitio