「Coding」の記事

トップへ戻るボタンの実装方法はググればいくらでも出てきます。コードもいろいろ落ちています。だから実装自体はそんなに難しいものではありません。でもどういう処理が行われているか、きちんと理解して使っていますか。この記事は基礎から理解できるようにていねいに解説します。

一定の高さまでスクロールしたらヘッダーの色が変化する動作はよく目にしますが、どうやって実装しているのか気になりますね。本記事はjQueryにまだ慣れていない人でも実装できるように、ていねいに解説します。

ページの読み込みに時間がかかる場合はローディング画面があった方がいい。でも実装となるとちょっと難しそう。そう思う人は少なくないはず。しかし実装は案外簡単です。本記事は初心者でもローディング画面実装が必ずできるように、ていねいに解説します。ぜひ一緒に作ってみましょう。

Swiperには多くのオプションがあります。全部を網羅することは不可能ですので、ここでは実用的なスライダーの使い方を紹介します。少しずつでもSwiperに慣れていきましょう！

スライダープラグインはいろいろありますが、今回は「Swiper」を紹介します。バージョン6とバージョン7ではHTMLの記述が一部変更になっているので注意が必要です。使い方さえマスターすれば、多機能でカスタマイズも自由自在なので最強のスライダーになってくれることでしょう。

コーディング速度を上げるためにまずすべきことは、タイピング速度の向上、スニペットの登録、そしてEmmetです。一部でもEmmetを取り入れることで確実にコーディング速度は上がります。Emmetにはどんなものがあるのか一緒に見ていきましょう。

ドロワーメニューを自作するのは結構大変ですが、ライブラリを用いれば簡単に実装できます。その中でも「drawer.js」は初心者の方でもすぐに実装可能な優れものです。その使い方を見ていきましょう。

モーダルウインドウの作り方がわからない…。それなら覚えましょう。とはいってもプラグインもあるし作り方もさまざまです。その中でも今回はdata属性を使う方法を見てみましょう。data型を使ってjQueryの実装を楽にしましょう！

アコーディオンメニューが上手く作れない、jQueryのコードが理解できないと悩んでいる方はいませんか？実は僕もそうでした。思ったような挙動にならない、そんなときサンプルコードがあれば助かります。一緒にアコーディオンメニューのコードを見ていき使いこなせるようになりましょう。

Web制作では必ずといっていいほど出てくるドロワーメニューの実装。jQueryを使って簡単に実装しましょうと言われても、初心者にはチンプンカンプンです。大事なのはその仕組を理解すること。ここではわかりやすくシンプルに解説します。