Friki Bloggeo

HighSlide es un maravilloso script que te permite abrir las imagenes de tu blog en la misma ventana o pagina. Es decir, ya no es necesario que el usuario salga de tu pagina al hacer clic sobre una imagen, si no, que a la imagen que le apliques el Javascript, al hacer clic sobre ella abrira con un efecto Zoom, que se activara una vez dado el clic sobre la imagen deseada. Highslide te permite crear tambien galeria de imagenes, con distintos diseños, en la imagen de la izquierda se pueden vizualizar dos modelos de las ventanas modales, y eso no es nada para las demas que ofrece, tambien, te permite mover la imagen de un lado a otro de la pagina. En esta entrada, te ensañare a aplicar el efecto dentro de tu blog, pero para empezar, es necesario que veas una muestra en la pagina del autor.

<script type="text/javascript" src="http://h1.ripway.com/inacho/highslide-with-gallery.js"></script>
<link rel="stylesheet" type="text/css" href="http://h1.ripway.com/inacho/highslide.css" />

<script type="text/javascript">
hs.graphicsDir = 'http://h1.ripway.com/inacho/graphic/';
hs.align = 'center';
hs.transitions = ['expand', 'crossfade'];
hs.outlineType = 'rounded-white';
hs.fadeInOut = true;
//hs.dimmingOpacity = 0.75;

hs.addSlideshow({
//slideshowGroup: 'group1',
interval: 5000,
repeat: false,
useControls: true,
fixedControls: 'fit',
overlayOptions: {
opacity: .75,
position: 'bottom center',
hideOnMouseOut: true
}
});
</script>

Los slides dan un toque de profesionalismo en cada pagina web o blog que los posea, ya que tienen efectos vistosos que rápidamente pueden llamar la atención del lector, invitándolos a hacer clics sobre cada uno de ellos. Este no es el primer Slide con desplazamiento que he publicado en este blog, de hecho, hay uno aquí publicado que posee el mismo efecto y usa jQuery para su acción pero es totalmente diferente en su estilo.

Ya hace un buen tiempo, publique una entrada que nos permitia mostrar un slide con nuestras entradas favoritas, pero a diferencia, del que les explicare hoy, este no era automatico, si no manual, manejandose por dos flechas apuntando hacia las dos direcciones, y que al hacer click se pasaba a la otra parte del contenido con un efecto de dezplazamiento muy bonito, producido por jQuery.

hola man no se el cambio para ver cada entrada que colcocas es manual...??
osea siempre tego que apretar la flechita para que cambie, como lo hago que sea automatico...

Bien aqui les dejo esta imagen de muestra, para que vean como es el slide, de todas maneras, puedes ver una demostracion en este blog de pruebas.

Lo que mas me gusta de los Scripts es el gran tipo de interacción que pueden ofrecer a los blogs, algo que con tan solo usar HTML y CSS, no es imposible hacerlo, pero tal vez un poco dificil, hoy traigo para ti, un slide, uno donde tu podras mostrar resumenes de tu entradas favoritas, quizas, tu entradas populares, o las mas comentadas, o las recientes, puedes añadirles las que quieras y cuantas quieras.

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>

<script src='http://sites.google.com/site/archivosfrikibloggeo/slide/jQuery1-FrikiBloggeo.js' type='text/javascript'/>

<script src='http://sites.google.com/site/archivosfrikibloggeo/slide/jQuery2-FrikiBloggeo.js' type='text/javascript'/>

<script src='http://sites.google.com/site/archivosfrikibloggeo/slide/jQuery3-FrikiBloggeo.js' type='text/javascript'/>

<script src='http://sites.google.com/site/archivosfrikibloggeo/slide/jQuery4-FrikiBloggeo.js' type='text/javascript'/>

<link href='http://sites.google.com/site/archivosfrikibloggeo/slide/Estiloslidecss-FrikiBloggeo.css' rel='stylesheet' type='text/css'/>