Queli Coto Desarrollador Web

github.com es un servicio online donde puedes crear tus propios repositorios de archivos para tus aplicaciones, modulos, plugins etc. De esta forma puedes mantener tus plugins muy fácilmente,  además de ahorrarte en ancho de banda en tu hosting.

Pues bien, hoy  me he registrado (nothnk) y he subido los dos plugins que tenía publicados en este blog, tengo unos cuantos más no sólo de Jquery, que con la facilidad que ofrece este servicio publicaré y mantendré.

De momento sólo están disponibles el jquery-links y el jquery-gallery y sin las modificaciones pendientes.

Existen muchísimos tutoriales para este fin, yo voy a detallar el que de momento más me convence, y no es otro que utilizar un plugin para jquery.

Por lo que hoy toca hablar de:

Plugin jquery media - carga elementos flash dentro de una página de manera accesible

Para los que lo conozcáis no les hará falta que les diga las bondades de este fantástico plugin y para los que no, enseguida quedarán enganchados con el.

Contenidos que podemos cargar con este plugin

Video

Jquery media es un plugin, que además de cargar contenido flash en un formato swf, también nos coloca el reproductor de video según el formato, flv, mov, avi …

Ejemplos

pero no sólo sirve para eso, podemos cargar contenidos de Audio, Silverlight Demo , (pdf, html) ,

También soporta la técnica sIRF, que como bien explican en diseñorama ,

sIFR es un script que reemplaza un elemento de texto (o varios) en una página por un archivo flash que despliega el mismo texto. Esto nos permite utilizar tipografías que no estén instaladas y tener texto con suavizado (anti-aliasing).

El otro día para una página, dentro de un proyecto que pronto presentaré, necesitábamos , colocar una presentación powerpoint online, lo primero que se nos ocurrió fue usar slideshare, sitio dedicado exclusivamente a esto, pero el código que nos genera no es accesible, fue probarlo con jquery-media y voalá!! problema resuelto.

código

[CODE]

<a href=”http://static.slideshare.net/swf/ssplayer2.swf?doc=unobtrusivejquery-1210086958470711-9″ class=”media {width: 376, height: 312, autoplay: true}”>
Descripcion del power point

</a>

[/CODE]

En el href, se pondrá la url, a la presentación y ya está, claro teniendo la librería jquery y el plugin jquery-media ya cargado, evidentemente.

Aprovecho para colocar una fantástica presentación sobre jquery no obtrusivo.

Descripcion del power point

Por último, mencionar un par de plugins nuevos para jquery para usar con imágenes.

jquery magnify

jquery jflip

Esta nueva versión trae mejoras considerables, aparte de solucionar un montón de bugs nostrae lo siguiente.

300% Speed Improvements to $(DOMElement)

.ready() Overhaul

• Mejora considerablemente el ready en los internet explorer
• Todos los navegadores esperan a que el css esté cargado
• Podemos usarlo dentro de la funcion .bind, $(document).bind("ready", fn);

.bind(”mouseenter”) / .bind(”mouseleave”)

Tenemos dos nuevas funciones para nuestro ratón, al pulsarlo y al soltarlo.

[code]

$("li").bind("mouseenter", function(){

  $(this).addClass("hover");

}).bind("mouseleave", function(){

  $(this).removeClass("hover");

});

[/code]

.bind(”mousewheel”)

También tenemos un plugin nuevo para la rueda del ratón, que nos puede ser útil por ejemplo galerías, tablas de datos …

[code]

$("div").bind("mousewheel", function(event, delta){

  if ( delta < 0 )

    $(this).append("up");

  else

    $(this).append("down");

});

[/code]

Complex :not()

Soporta completamente el nuevo selector CSS3 , E:not(s): un elemento que no coincide con los selector simples. En este ejemplo sería un li que no está activo, no está en hover y contien el texto test

[code]

$("li:not(.active,.hover,:contains(test))")

[/code]

Accept Headers

Muy necesarío sobre todo cuando traíamos datos desde ajax.

• xml “application/xml, text/xml”
• html “text/html”
• script “text/javascript, application/javascript”
• json “application/json, text/javascript”
• text “text/plain”
• Everything else: “*/*”

Descarga y más información en jquery.com