【Javascript】matchMedia / addEventListener【レスポンシブ】
《参考》matchMedia / MediaQueryList / addEventListener https://developer.mozilla.org/ja/docs/Web/API/Window/matchM…
《参考》matchMedia / MediaQueryList / addEventListener https://developer.mozilla.org/ja/docs/Web/API/Window/matchM…
スクロールすると、ふんわり表示されるアレ。今では多くのサイトで見かけるようになりましたし、仕事上でも、「ふんわり表示されるやつを実装してほしい」とのご要望もよくあります。最近制作担当したサイトでは、数件連続でふんわり実装…
チェックボックスがchecked(true)の時、またはチェックされていない(false)時に●●したい、というやつです。 これは結構よく使う。
個人的にですけど、画像の拡大表示によく使う「lightbox」。個人的にとは言いましたが、お仕事上でも「画像の拡大表示」にはよく使います。 もともと画像を配置していたけど、拡大表示にはしていなかった箇所。やっぱり拡大表示…
画像にhoverしたらimgタグのsrcを入れ替えて、他の画像を表示するというのはよく見かけますが、 imgタグにhoverできるとは限らない(画像の上に他要素が重なっているなどの)場合も多いのでサムネイル画像の親要素に…
“min-width: 768px”時には〇〇〇という感じ。 HTML Javascript/jQuery min-width: 768px は、タブレットやパソコンの時。でなければ、スマホの時、…
target=”_blank” の箇所に自動的に rel=”noopener” を追加します。 ※IE11は”forEach”はサポート対象外です。…
swiper-slideが複数の時はデフォルト( 左寄せ )、ひとつの時のみセンター表示にしたい。 ≪前提として以下のオプションを設定≫slidesPerView: “auto”,spaceBet…
前回は matchMedia()とquerySelector() を使っての覚書でしたが、今回は、matchMedia()とquerySelectorAll() を使っての覚書。※ querySelector() はペー…
ブレークポイントで処理を振り分ける方法は色々ありますが今回は matchMedia()とquerySelector() を使っての覚書。※ querySelector() は、最初のひとつの要素しか返しません。よって、一…