JavaScript
皆さんこんばんは(^o^)１週間が始まりましたね。 今日は制作現場でもよく使うjQueryの使い方をご紹介します。 jQueryはライブラリを読み込み利用しますが今回は割愛します。 ▼変数定義について 慣習上、変数の冒頭に$をつけます。 const $input = $("input")…
【JavaScript】ローカルストレージを使ってメールアドレスを保存しよう
皆さんこんばんは(^o^) 今日は夏を彷彿させる暑さでしたね・ω・ 体調を崩しやすい季節なので体調管理には気をつけていきましょう。 今日はお問い合わせフォームなどでよく使われているCookieえを保存する方法を ご紹介します。 先ずはindex.htmを用意します…
最近仕事が忙しく今日もギリギリの更新になってしまいました。 これから寒くなっていくので体調には気をつけていきましょう！ 今日は画面をロードするごとに画像が切り替わる仕組みをお伝えします。 まず画像を3枚用意してください。種類はなんでもOKです。 …
楽天ブックス こんばんは。今日も雨が振りましたね。 ただ秋に突入しだんだんと過ごしやすい気候になってきました。 さて、今日は少し難しいのですがAjax通信を用いたコードを展開します。 まず2つファイルを用意します。(コピペしてお試しください) cakes.j…
おまたせしました！今日はPug編の2回目です。 今日はPugを使った基礎的な記法をご紹介いたします＼(^o^)／ 1回目では環境構築の記事を書いているのでまだの方はぜひ見ておいてください！ frontendblog.hatenablog.com まずはフォルダにsrc/pug/というディレ…
こんばんは！今日は一日雨でジメジメした日が続きますね。 まだ週初めなので頑張っていきましょう！ さて、今日は JSファイルをモジュールとして呼び出す方法を 紹介します。 まずは下記階層のフォルダを用意してください。 dist └index.html └js └script.js…
今日は簡単なタイマーを作ってみようと思います。 先ずはHTMLファイルをご用意ください。 <html lang="ja"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>timer</title> <style></style> </head> <body> </body></html>
こんばんは！今日も雨で毎日ジメジメしてますね。 さて、今日はチェックボックスにチェックをいれたらボタンを押せる仕組みを作りたいと思います。 よく問い合わせの送信フォームにあるやつですね＼(^o^)／ まずはHTMLを用意しましょう！ <html lang="ja"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> </meta></meta></head></html>
皆さんこんばんは(^^)今週ずっと雨で寒い日が続いてますね。 今日はHTMLを効率的に書く方法をお伝えします。2回に分けて紹介するのでぜひお試しください。 HTMLを効率的に書く方法としてPugという記法があります。 閉じタグを意識せずにかけるのでコーディン…
今日は実際にキーボードで打った文字を画面に出力するプログラミングをご紹介します。まずHTMLファイルをご用意ください＼(^o^)／ ※コピペしてHTMLファイルに貼り付けてください。 <html> <head> <meta charset="utf-8" /> <title>タイピング</title> </head> <body> <div id="target"></div> </body> </html> これでHTMLファイルは完了です。 次にbodyの閉じタグ前…
