前提・実現したいこと
ご覧頂きありがとうございます。
slickを使ったスライダーなのですが、日本語サイトと英語サイトで表示数を変更したいのでご質問させて頂きました。
・内容
日本語サイトと英語サイトで同じクラスを使用しているのですが、cssのhtml[lang="en"] *** { ** }のように
Jqueryのセレクタ指定でも言語別で内容を変更することは可能でしょうか。
下記コードでは英語サイトのsliderに.slider01enと言うクラスを付与し、二つのセレクタで指定してみたのですが
日本語、英語サイト共に上の.slider01の内容が反映されてしまいました。
なんとか.slider01のクラスは変更せず、日本語サイト、英語サイトでスライダーの表示数を変更したいです。
該当のソースコード
js
1 $('.Slider01').slick({ 2 infinite: true, 3 dots: false, 4 arrows: true, 5 autoplay: true, 6 swipe: true, 7 autoplaySpeed: 4000, 8 slidesToShow: 5, 9 slidesToScroll: 1, 10 responsive: [ 11 { 12 breakpoint: 1600, 13 settings: { 14 slidesToShow: 4, 15 slidesToScroll: 1 16 } 17 }, 18 { 19 breakpoint: 1200, 20 settings: { 21 slidesToShow: 3, 22 slidesToScroll: 1 23 } 24 }, 25 { 26 breakpoint: 767, 27 settings: { 28 slidesToShow: 2, 29 slidesToScroll: 1 30 } 31 }, 32 { 33 breakpoint: 500, 34 settings: { 35 slidesToShow: 1, 36 slidesToScroll: 1 37 } 38 } 39 ] 40 }); 41 42$('.Slider01.Slider01en').slick({ 43 infinite: true, 44 dots: false, 45 arrows: true, 46 autoplay: true, 47 swipe: true, 48 autoplaySpeed: 4000, 49 slidesToShow: 3, 50 slidesToScroll: 1, 51 responsive: [ 52 { 53 breakpoint: 1600, 54 settings: { 55 slidesToShow: 3, 56 slidesToScroll: 1 57 } 58 }, 59 { 60 breakpoint: 1200, 61 settings: { 62 slidesToShow: 3, 63 slidesToScroll: 1 64 } 65 }, 66 { 67 breakpoint: 767, 68 settings: { 69 slidesToShow: 2, 70 slidesToScroll: 1 71 } 72 }, 73 { 74 breakpoint: 500, 75 settings: { 76 slidesToShow: 1, 77 slidesToScroll: 1 78 } 79 } 80 ] 81 });
試したこと
セレクタの指定方法を調べて色々と試してみましたが行き詰ってしまったのでご質問いたしました。
お手数おかけいたしますがご教授頂けますと幸いです。
よろしくお願いいたします。
補足情報(FW/ツールのバージョンなど)
ここにより詳細な情報を記載してください。
回答1件
あなたの回答
tips
プレビュー