monitojoomla

Tip - Usar Jquery en Joomla

Jueves, 03 Junio 2010 | Escrito por Jhon Marreros Guzman

Detalles Tip - Nivel : Intermedio, Versión Joomla : 1.5.x, Formato : texto y video
Joomla viene con mootools por defecto, y a pesar de ser un framework javascript muy poderoso, en algunas situaciones nos gustaría utilizar un efecto construido en jquery.

En el siguiente video muestro un ejemplo real de cómo utilicé jquery para que no tenga conflicto con mootols en joomla

Usando Jquery

Primero, como buena práctica es importante cargar la librería desde un sitio web como google, jquery o microsof, en lugar de hacerlo bajando la libreria y cargarlo desde nuestro hosting, para ver más detalles consultar la página web del sitio de jquery descargas. A continuación listo la referencia que uso en el ejemplo del video:

//Referencia usuando google
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>

Jquery sin conflicto con Mootools

Mootools al igual que Jquery utiliza el símbolo "$" para la selección de elementos del DOM, por lo que una manera natural sería reemplazando todo lo escrito en Jquery de "$" -> "jQuery" (la función jQuery reemplaza al símbolo $), afortunadamente existe una manera más sencilla que nos permite utilizar el símbolo $ en Mootools y en Jquery.

jQuery.noConflict();
 
// colocar todo el código dentro del área de ready
jQuery(document).ready(function($){
 
 $('#algun_id').click(function(){
 //codigo de con jquery
 });

});

para más información visitar la página de jquery y otras librerias

Comparte este post