jQuery no conflict

Eu só quero de uma vez por todas ter alguma clareza sobre o jQuery no WordPress, pois nunca consigo lembrar de um projeto para o outro como as coisas devem ser feitas.

O exemplo específico de que estou falando é o flexslider. No site em que estou trabalhando agora tentei:

jQuery(document).ready(function($) { $('.flexslider').flexslider({ slideshow: true, animationSpeed: 400, initDelay: 100, animation: "slide", animationLoop: true, itemWidth: 258, itemMargin: 26 }); }); 

Isso funciona no Opera, mas não no Firefox, e tentou:

 jQuery(document).ready(function($) { jQuery('.flexslider').flexslider({ slideshow: true, animationSpeed: 400, initDelay: 100, animation: "slide", animationLoop: true, itemWidth: 258, itemMargin: 26 }); }); 

Isso funciona no Firefox, mas não no Opera, outros navegadores ainda não testados.

Qual é a maneira correta de fazer isso para trabalhar em todos os navegadores?

obrigado

Solutions Collecting From Web of "jQuery no conflict"

Eu prefiro isso:

 (function($){ "use strict"; $(document).ready(function(){ $('.flexslider').flexslider({ slideshow: true, animationSpeed: 400, initDelay: 100, animation: "slide", animationLoop: true, itemWidth: 258, itemMargin: 26 }); }); })(this.jQuery); 

Para que o jQuery funcione no modo noconflict, você precisa envolver todas as funções em seu arquivo js como este:

 jQuery(window).ready(function( $ ) { Your functions here }); 

Agora você pode usar o seletor $ como de costume:

 $(window).load(function(){ Stuff here }); 

ou

 $(document).ready(function(){ Stuff here }); 

Eu costumo usar o primeiro, porque document.ready às vezes entra em conflito com o modificador do tema WordPress (sem idéia do porquê).

Para responder a esta pergunta, é mais sobre como você liga jQuery ao invés de como você chama a function.

Acabei de mudar meu link direto para jQuery para o seguinte:

 if (!is_admin()) add_action("wp_enqueue_scripts", "my_jquery_enqueue", 11); function my_jquery_enqueue() { wp_deregister_script('jquery'); wp_register_script('jquery', "http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js", false, null); wp_enqueue_script('jquery'); } 

Isso é tomado frmo CSS Tricks e publicado em functions.php, isso agora faz o seguinte trabalho em todos os navegadores:

 jQuery(document).ready(function($) { $('.flexslider').flexslider({ slideshow: true, animationSpeed: 400, initDelay: 100, animation: "slide", animationLoop: true, itemWidth: 258, itemMargin: 26 }); });