javascript jQueryでボタン連打を防止する方法 フォームやチュートリアルの「選択ボタン」や「進むボタン」、「戻るボタン」を作る時、 連打防止がついてるとめっちゃ親切。 ボタン連打防止があるサイトを見ると丁寧に作ってあるなぁと感心しちゃいます。 今回は、そんな関心出来るサイトを作るために付... 2020年06月10日 javascriptjQueryサイト制作
javascript jQueryでinput、textareaの入力を検知する方法 jQueryでフォームのインプット、テキストエリアの入力を検知する方法のご紹介です。 入力検知にはいくつかあるので、DEMOで動きを確認しながらどれが最適か選択してください。 DEMO 「keypress」を使った入力検知|キーを押した時に... 2020年06月07日 javascriptjQueryサイト制作
javascript jQueryで特定文字列より後ろを削除する方法 jQueryで特定の文字列以降を削除する方法のご紹介です。 特定の文字列以降を削除する時に自分の中で一番よく使う方法は「split()」を使ったもの。 「split()」は、指定文字列(「,」や「/」など)ごとに分割して配列に格納してくれる... 2020年06月04日 javascriptjQueryサイト制作
HTML テキストエリア(textarea)を変更不可にする方法|HTML フォームのテキストエリア(textarea)を変更できなくする方法のご紹介です。 テキストエリア(textarea)を変更できなくする場合は「readonly属性」を使います。 DEMO このテキストは消せません(意味はないですが文字をいろ... 2020年06月01日 HTMLサイト制作
javascript jQueryでCSSを動的に変更・追加・削除する方法 jQueryでCSSを変更する方法のご紹介です。どうやってCSSを変更したらいいかわからない時などにご覧いただければ嬉しいです。 2020年05月29日 javascriptjQueryサイト制作
CSS width 100%なのに、なぜはみ出た!?を解決する方法|CSS 幅を指定したのにはみ出ちゃう時「width」を98%とかに指定して何とかはみ出さないようにと考えちゃうけど、それは間違っている。ちゃんと「width:100%」でpaddingやborderを含んでいてもはみ出さない方法をご紹介します。 2020年05月26日 CSSサイト制作
javascript jQueryで「○○○」が含まれていたら|.indexOf() jQueryで特定文字が含まれる時って色々方法がある。今回は「.indexOf()」を使った切り分けのご紹介です。 2020年05月23日 javascriptjQuery
javascript jQueryで現在のURLを取得 jQueryで今のページのURLを取得する方法は、「$(location).attr('href');」です!このページに動作確認のDEMOがあるので、気になる方はページを見に来てくださいね。 2020年05月20日 javascriptjQueryサイト制作
javascript jQueryで、読み込みとリサイズ処理を一緒にと、ロードとリサイズ処理を一緒に書く方法 jQueryでロードとリサイズを一緒に書く方法のご紹介です。 $(function() { $(window).on("load resize", function() { // ロードとリサイズ時の処理 }); }); 次に読み込み時とリ... 2020年05月17日 javascriptjQueryサイト制作
HTML HTMLでリンク先を別タブ・別ウィンドウで表示する方法 リンクを押したら別タブ・別ウィンドウで表示する方法のご紹介。 まずは別タブでの表示方法から。 aタグに「target="_blank"」を書くことで別タブで表示可能です。 別タブでリンクを開く方法 <a href="" target="_b... 2020年05月14日 HTMLサイト制作
javascript jQueryで端末判定&Androidバージョン判定 jQueryでの端末を判定する方法のご紹介です。 まずは、PC、スマホ、タブレットを判定するコードを紹介します。 DEMO あなたの端末はです! // ユーザーの端末情報を「use」に格納します。 var use = navigator.u... 2020年05月11日 javascriptjQueryサイト制作
CSS CSSのposition:stickyを使ったスクロール特定範囲の固定方法 サイドバーやコンテンツで一定範囲、スクロールに追随する要素の作り方のご紹介です。 まずは、デモで動きを確認してみよう。 DEMO 1 2 3 4 5 6 7 8 9 10 HTML <div class="demo1"> <div clas... 2020年05月08日 CSSサイト制作
サイト制作 CSSのoverflow:scrollで横スクロールバーを消す方法 CSSで「overflow:scroll」を指定した時、縦だけでいいのに横にもスクロールバーが出てくる。 この少しイヤな横スクロールバーを全ブラウザで消す方法の紹介です。 CSS .demo { overflow-x: hidden; ov... 2020年05月05日 サイト制作
CSS CSSで高さの違う横並び要素を上揃えで配置する方法 「display:inline-block」を使って横並びにした要素の高さが違うと、思った配置にならない時が結構ある。 そんな時に使うCSSのご紹介です。 高さの違うコンテンツに下の「vertical-align」を指定すれば上揃えや下揃え... 2020年05月02日 CSSサイト制作
javascript jQueryで加速度センサー値の取得と使い方【iOS16対応】 スマホの加速度センサーを利用する方法のご紹介です。 加速度センサーとは、傾きを取得するセンサー。 近年、プライバシー保護やセキュリティー面が厳しくなり、特にiOS(iOS13以降)は、ユーザーの許可が無いとセンサーの値を取得できないくらい厳... 2020年04月29日 javascriptjQueryサイト制作