お知らせ

最終課題という感じで、もう一回LPのコーディングをしてみましょう！難易度は最初よりも高いと思います。ボリュームもあるので3日間の期間を設けました。 実際のお仕事でも（急ぎでなければ）3日から5日ほど期間をもらっています。 […]

Webサイト（ブラウザ）はSassを読み取りことはできません。あくまでもHTMLやCSSだけです。 なので、Sassで記載した内容をCSSに変換してあげる処理が必要になります。変換する方法（ツール）は色々ありますが、1週 […]

CSSは管理がとても大変… その大変なCSSの管理を楽にすべく登場したのがSassという言語です。 使えるようになっておくと、コーディングが早く、ミスが少なく、管理が楽になります。 今回の30DAYSではガッ […]

よくコーディングで登場するモーダルをデザインカンプを見ながら作って行きましょう！ 課題：モーダルを作る Contactセクションの「プライバシーポリシー」のリンクをクリックした時にモーダルで内容が表示されるようにしてくだ […]

アコーディオンを使った実践的なコーディングをしてみます。アコーディオンがよく使われる代表的なアイテムが「Q and A」です。 課題：Q and Aをアコーディオンでコーディング アコーディオンについては、Progate […]

個人的にjQueryでよく使うのが要素をクリックした時の処理です。 今回は、ページ内リンクでクリックした要素に対して下線を引くという処理を加えてください。 課題：ページ内リンクでクリックした要素に対して下線を引いたままに […]

内部リンクをクリックした時に「ぐいーん」と移動した方がページ内を移動していることが理解できて少し親切だと思います。この動きのことをスムーススクロールと呼んだりします（呼び方はスムーズスクロールの説もあり） そして、スムー […]

スマホ時のグローバルメニューをドロワーメニューで作っていきましょう。 スマホ時のドロワーメニューを作る 以下のようなドロワーメニューを作成してください。「drawer-open」の方が通常時、「drawer-close」 […]

スクロールに応じて要素が「フワッ」と登場させるアニメーションもWebサイトで好まれがちな動きです。今回はこの動きを実装してもらいます。 課題：スクロールに応じて要素を「フワッ」と登場させる DAY11あたりまでに作成した […]

スライダーを作っていきましょう。スライダーはカルーセルとも呼ばれたりします。 作ると言っても、ライブラリの使い方を覚えることと、そのライブラリをカスタマイズできればとりあえずはOKだと思います。 課題：メインビジュアルを […]