DAY49.実務でよく使うアニメーションの付け方編 アコーディオン
01.slideToggle()で簡単アコーディオン実装
jQuery('.accordion__head').click(function() {
jQuery(this).next().slideToggle();
jQuery(this).children('.accordion__icon').toggleClass( 'is-open' );
});
jQuery(this)に対する、next()やchildren()といった
相対的な位置関係もよく使う
.qa-box__q {
color: #fff ;
background: $color-main;
padding: 12px 56px;
font-weight: 700;
position: relative;
&::before {
content: "Q";
position: absolute;
top: 12px;
left: 20px;
}
}
content: "Q";
でQの文字を入れることができる
この記事が気に入ったらサポートをしてみませんか?