Easy News Plus, diapositiva de noticias

En uno de los comentarios me preguntaron por el slideshow ó diapositiva de noticias que se pueden apreciar en la página inicial del blog (y directorio de categorias también). Pues se trata de Easy News Plus un plugin que implementa facilmente un slideshow de contenido HTML que funciona con jQuery.

Cuenta con las siguientes características:

Cross browser (compatibilidad con la mayoría de navegadores web) .
Botones Previo, Pause y Siguiente.
No necesita de otros plugins.
Acepta cuaquier contenido HTML, incluso Flash.
Soporte efecto de transición muy suave.
Velocidad de visualización ajustable.
Diseño editable mediante su hoja de estilos.

HTML

Primero creamos el contenedor de todas las noticias ó HTML que queremos mostrar.

<div id="mynews" style="display:none">
<div class="news_style">Contenido HTML ...</div>
<div class="news_style">Contenido HTML .../div>
..........mas noticias.................
</div>

Creamos otro contendor para mostrar las noticias.

<div  id=showhere></div>

Insertamos los botones Prev, Siguiente y Pause (por defecto usar los siguientes nombres de archivo: prev0.gif, next0.gif, pause0.gif).

<div class=buttondiv id=news_button>
<img src=prev.gif align="absmiddle" id=news_prev>
<img src=pause.gif align="absmiddle" id=news_pause>
<img src=next.gif align="absmiddle" id=news_next>
</div>

Opcionalmente creamos un contendor para mostrar el título de las noticias:

<div id=news_display ></div>

JavaScript

Descargamos jQuery y el plugin de esta herramienta. Antes del </head> incluir este código JavaScript.

<script type="text/javascript" src="jquery-1.2.3.pack.js"></script>
<script type="text/javascript" src="jquery.easynews.plus.js"></script>
<script>
$(document).ready(function(){
  var newsoption = {
  firstname: "mynews",
  secondname: "showhere",
  thirdname:"news_display",
  fourthname:"news_button" ,
  playingtitle:"Now Playing:",
  nexttitle:"Next News:",
  prevtitle:"prev News:",
  newsspeed:'8000',
  isauto:'1',
  newscountname:"test",
  imagedir:'/dir/easynewsplus/',
  disablenewscount:false
  }
  $.init_plus(newsoption);
});
</script>