【slick エラー】Uncaught TypeError: Cannot read property ‘add’ of null の対処方法
皆さん、こんにちは。
制作部の関です。
今回は「slick.jsのエラー Uncaught TypeError: Cannot read property ‘add’ of null の対処方法」についてのお話をします。
とあるサイトでslickのエラーが発生し、ハンバーガーメニューやアコーディオンが正常に動かないなど,他のjsが正常に動作しない現象が起きています。
今回エラーの修正方法を調べましたので、備忘録として残しておきます。
以下のようなエラーが起きていたら、
次の記事のように設置すればエラーは直りますので、参考にどうぞ。
▼エラー
「Uncaught TypeError: Cannot read property ‘add’ of null」
修正前
$(‘要素のセレクタ’).slick();
↓
修正後
$(‘要素のセレクタ’).not(‘.slick-initialized’).slick();
【修正後のコード例】
<script src=”<?php echo get_template_directory_uri(); ?>/js/slick.js”></script>
<script>
$(‘.hoge-list’).not(‘.slick-initialized’).slick({
arrows: true,
dots: false,
speed: 1000,
slidesToShow: 4,
responsive: [
{
breakpoint: 1921, // 1920px以下のサイズに適用
settings: {
slidesToShow: 3
},
},{
breakpoint: 1201, // 1200px以下のサイズに適用
settings: {
slidesToShow: 2
},
},{
breakpoint: 577, // 576px以下のサイズに適用
settings: {
slidesToShow: 1
},
},
]
});
以上、制作部の関でした。
▼参考サイトはこちらになります
http://keylopment.com/faq/3423/