JavaScript не загружен на Wordpress

Question

Я работаю над этим website (Builted with Wordpress). Я пытаюсь реализовать <script> для анимации таблицы.

В частности, мне нужно отображать другое изображение справа каждый раз, когда вы идете с помощью мыши над строками таблицы.

Этот код я использую:

<script> 
    $(document).ready(function(){ 
$('.row1').hover(function() { 
    $('.one').toggle(); 
}); 

$('.row2').hover(function() { 
    $('.two').toggle(); 
}); 

$('.row3').hover(function() { 
    $('.tree').toggle(); 
}); 

$('.row4').hover(function() { 
    $('.four').toggle(); 
}); 

$('.row5').hover(function() { 
    $('.five').toggle(); 
}); 

$('.row6').hover(function() { 
    $('.six').toggle(); 
}); 

$('.row7').hover(function() { 
    $('.seven').toggle(); 
}); 

$('.row8').hover(function() { 
    $('.eight').toggle(); 
}); 

$('.row9').hover(function() { 
    $('.nine').toggle(); 
}); 

$('.row10').hover(function() { 
    $('.ten').toggle(); 
}); 

$('.row11').hover(function() { 
    $('.eleven').toggle(); 
}); 

$('.row12').hover(function() { 
    $('.twelve').toggle(); 
}); 

$('.row13').hover(function() { 
    $('.thirteen').toggle(); 
});  

$('.row14').hover(function() { 
    $('.quattordici').toggle(); 
});  

$('.row15').hover(function() { 
    $('.quindici').toggle(); 
});  

$('.row16').hover(function() { 
$('.sedici').toggle(); 
}); 

$('.row17').hover(function() { 
$('.diciassette').toggle(); 
}); 

$('.row18').hover(function() { 
$('.diciotto').toggle(); 
}); 

$('.row19').hover(function() { 
$('.diciannove').toggle(); 
}); 

$('.row20').hover(function() { 
$('.venti').toggle(); 
}); 

$('.row21').hover(function() { 
$('.ventuno').toggle(); 
}); 

$('.row22').hover(function() { 
$('.ventidue').toggle(); 
}); 

$('.row23').hover(function() { 
$('.ventitre').toggle(); 
}); 

$('.row24').hover(function() { 
$('.ventiquattro').toggle(); 
}); 

$('.row25').hover(function() { 
$('.venticinque').toggle(); 
}); 

$('.row26').hover(function() { 
$('.ventisei').toggle(); 
}); 

$('.row27').hover(function() { 
    $('.ventisette').toggle(); 
}); 

$('.row28').hover(function() { 
    $('.ventotto').toggle(); 
}); 

$('.row29').hover(function() { 
    $('.ventinove').toggle(); 
}); 

$('.row30').hover(function() { 
    $('.trenta').toggle(); 
}); 

$('.row31').hover(function() { 
    $('.trentuno').toggle(); 
}); 

$('.row32').hover(function() { 
    $('.trentadue').toggle(); 
}); 

$('.row33').hover(function() { 
    $('.trentatre').toggle(); 
}); 

$('.row34').hover(function() { 
    $('.trentaquattro').toggle(); 
}); 

$('.row35').hover(function() { 
    $('.trentacinque').toggle(); 
}); 

$('.row36').hover(function() { 
    $('.trentasei').toggle(); 
}); 

$('.row37').hover(function() { 
    $('.trentasette').toggle(); 
}); 

$('.row38').hover(function() { 
    $('.trentotto').toggle(); 
}); 

$('.row39').hover(function() { 
    $('.trentanove').toggle(); 
}); 

$('.row40').hover(function() { 
    $('.quaranta').toggle(); 
}); 

$('.row41').hover(function() { 
    $('.quarantuno').toggle(); 
}); 

$('.row42').hover(function() { 
    $('.quarantadue').toggle(); 
}); 

$('.row43').hover(function() { 
    $('.quarantatre').toggle(); 
}); 

$('.row44').hover(function() { 
    $('.quarantaquattro').toggle(); 
}); 

$('.row45').hover(function() { 
    $('.quarantacinque').toggle(); 
}); 

$('.row46').hover(function() { 
    $('.quarantasei').toggle(); 
}); 

$('.row47').hover(function() { 
    $('.quarantasette').toggle(); 
}); 

$('.row48').hover(function() { 
    $('.quarantotto').toggle(); 
}); 

$('.row49').hover(function() { 
    $('.quarantanove').toggle(); 
}); 

$('.row50').hover(function() { 
    $('.cinquanta').toggle(); 
}); 

$('.row51').hover(function() { 
    $('.cinquantuno').toggle(); 
}); 

$('.row52').hover(function() { 
    $('.cinquantadue').toggle(); 
}); 

$('.row53').hover(function() { 
    $('.hause2_1').toggle(); 
}); 

$('.row54').hover(function() { 
    $('.hause2_2').toggle(); 
}); 

$('.row55').hover(function() { 
    $('.hause2_3').toggle(); 
}); 

$('.row56').hover(function() { 
    $('.hause2_4').toggle(); 
}); 

$('.row57').hover(function() { 
    $('.hause2_5').toggle(); 
}); 

$('.row58').hover(function() { 
    $('.hause2_6').toggle(); 
}); 

$('.row59').hover(function() { 
    $('.hause2_7').toggle(); 
}); 

$('.row60').hover(function() { 
    $('.hause2_8').toggle(); 
}); 

$('.row61').hover(function() { 
    $('.hause2_9').toggle(); 
}); 

$('.row62').hover(function() { 
    $('.hause2_10').toggle(); 
}); 

$('.row63').hover(function() { 
    $('.hause2_11').toggle(); 
}); 

$('.row64').hover(function() { 
    $('.hause2_12').toggle(); 
}); 

$('.row65').hover(function() { 
    $('.hause2_13').toggle(); 
}); 

$('.row66').hover(function() { 
    $('.hause2_14').toggle(); 
}); 

$('.row67').hover(function() { 
    $('.hause2_15').toggle(); 
}); 

$('.row68').hover(function() { 
    $('.hause2_16').toggle(); 
}); 

$('.row69').hover(function() { 
    $('.hause2_17').toggle(); 
}); 

$('.row70').hover(function() { 
    $('.hause2_18').toggle(); 
}); 

$('.row71').hover(function() { 
    $('.hause2_19').toggle(); 
}); 

$('.row72').hover(function() { 
    $('.hause2_20').toggle(); 
}); 

$('.row73').hover(function() { 
    $('.hause2_21').toggle(); 
}); 

$('.row74').hover(function() { 
    $('.hause2_22').toggle(); 
}); 

$('.row75').hover(function() { 
    $('.hause2_23').toggle(); 
}); 

$('.row76').hover(function() { 
    $('.hause2_24').toggle(); 
}); 

$('.row77').hover(function() { 
    $('.hause2_25').toggle(); 
}); 

$('.row78').hover(function() { 
    $('.hause2_26').toggle(); 
}); 

$('.row79').hover(function() { 
    $('.hause2_27').toggle(); 
}); 

$('.row80').hover(function() { 
    $('.hause2_28').toggle(); 
}); 

$('.row81').hover(function() { 
    $('.hause2_29').toggle(); 
}); 

$('.row82').hover(function() { 
    $('.hause2_30').toggle(); 
});   

$('.row83').hover(function() { 
    $('.hause2_31').toggle(); 
}); 

$('.row84').hover(function() { 
    $('.hause2_32').toggle(); 
}); 

$('.row85').hover(function() { 
    $('.hause2_33').toggle(); 
}); 

$('.row86').hover(function() { 
    $('.hause2_34').toggle(); 
}); 

$('.row87').hover(function() { 
    $('.hause2_35').toggle(); 
}); 

$('.row88').hover(function() { 
    $('.hause2_36').toggle(); 
}); 

$('.row89').hover(function() { 
    $('.hause2_37').toggle(); 
}); 

$('.row90').hover(function() { 
    $('.hause2_38').toggle(); 
}); 

$('.row91').hover(function() { 
    $('.hause2_39').toggle(); 
}); 

$('.row92').hover(function() { 
    $('.hause2_40').toggle(); 
}); 

$('.row93').hover(function() { 
    $('.hause2_41').toggle(); 
}); 

$('.row94').hover(function() { 
    $('.hause2_42').toggle(); 
}); 

$('.row95').hover(function() { 
    $('.hause2_43').toggle(); 
}); 

$('.row96').hover(function() { 
    $('.hause2_44').toggle(); 
}); 

$('.row97').hover(function() { 
    $('.hause2_45').toggle(); 
});   
}); 
</script> 

Без результатов. Какие-нибудь советы?

Answer 1

Without results

О, я подозреваю, что есть результаты. Откройте веб-консоль, у вас, вероятно, есть сообщение об ошибке. :-)

По умолчанию Wordpress вызывает режим jQuery noConflict, и для его доступа вам необходимо использовать jQuery, а не $.

Обратный вызов jQuery's ready, который вы уже используете, передаст вам ссылку на jQuery в качестве первого аргумента. Вы можете использовать $, как это имя аргумента, то есть вы просто должны изменить $(document) к jQuery(document):

jQuery(document).ready(function($){ 
    $('.row1').hover(function() { 
     $('.one').toggle(); 
    }); 
    // ...and so on... 
});