Wordpress breaks jQuery background animation script

Question

Я получаю приведенную ниже ошибку (73TypeError) на небольшом сценарии фоновой анимации, когда включен в заголовок темы Wordpress, что нарушает сценарий. Я не вижу никакой ошибки, когда скрипт включен на не Wordpress странице:

Вот сценарий:

$(function() { 
    $(".bottom").hover(function() { 
     $(this).animate({ 
     backgroundPosition : '0px 35px'} 
     , 300); } 
    , function() { 
     $(this).animate({ 
     backgroundPosition : '0px 0px'} 
     , 600); } 
    ); 
    } 
); 

Может кто-то посоветовать на то, что вызывает эту ошибку?

Спасибо,

Ник

Answer 1

Кулак прочь в WordPress, JQuery должен быть загружен не-конфликтный. Таким образом, в этом случае ваш файл должен быть;

var $j = jQuery.noConflict(); 

$j(function() { 
    $j(".bottom").hover(function() { 
     $j(this).animate({ 
     backgroundPosition : '0px 35px'} 
     , 300); } 
    , function() { 
     $j(this).animate({ 
     backgroundPosition : '0px 0px'} 
     , 600); } 
    ); 
    } 
); 

и во-вторых, как неопределенная упоминалось, вам необходимо загрузить JQuery с помощью wp-enqueue-script();

Для достижения этой цели, для достижения наилучших практик, поместите JQuery в отдельном файле. назовите его, например, bganimation.js

Теперь для загрузки этого js-файла в wordpress используйте wp-enqueue-script(); как это.

function this_is_jquery_example(){ 
wp_enqueue_script('jquery');; 
wp_enqueue_script('myscript', plugin_dir_url(__FILE__) .' bganimation.js'); 

} 
add_action('wp_enqueue_scripts','this_is_jquery_example'); 

надеюсь, что это поможет.