HTML・CSS コーディングJSフォームプラグイン フォームの入力補完機能Autocompleteを無効にする方法 2021年4月23日 フォームの入力保管機能は便利ですが、サイトの構築内容によっては、思わぬ妨害にもなってしまう場合があると思います。 そこで今回は、フォームの入力保管機能であるAutocompleteを無効にする方法について紹介していきます。 html側でフォームのAutocompleteを無効にする方法 ■フォーム全体にAutocomp...
JQuery コーディングJS jqueryの実行処理をレスポンシブ時に分岐する方法 2020年8月2日 JQueryの実行処理をレスポンシブのブレイクポイントによって、条件分岐したいときが稀にあります。 ユーザーエージェントで分岐する方法もありますが、もっと手軽に使いやすいようにレスポンシブのブレイクポイントに合わせた方法について調べてみました。 目次 ・JQueryの実行処理を条件分岐する ・jqueryの実行処理をレ...
JQuery コーディングJS jqueryを使ってタブ切り替えのイベントを実装する方法 2020年7月29日 Webサイト内で、情報を分かりやすくまとめるために、タブ切り替えのBoxを実装することは、一つの手法であります。今回はそんなタブ切り替えについて、タブとターゲットとなる切り替えBoxが離れていても動作するタブ機能をJQueryを使って実装していきます。 今までタブ切り替えを実装したことがない方は、是非参考にしていただけ...
HTML・CSS コーディングJS urlパラメータ渡しをページ内リンクで適用する方法 2020年7月17日 以前の記事でHTMLリンクでパラメータ渡しについて紹介しましたが、今回は同一ページ内でのページ内リンクでパラメータを渡す方法について承知していきたいと思います。 HTMLリンクのパラメータ渡しについて先に知りたい方は、下記記事をお読みください。 ↓↓↓↓ https://fractales.jp/javascript/...
JQuery コーディングJS slickをレスポンシブにおいてスマホ時のみ動作する方法 2020年7月15日 JQueyのスライダーの中でもレスポンシブ対応で動作が安定して使いやすいslick.jsですが、スマホのみ動作させたい場合どのようにすればいいのか調べてみました。調査して分かったことを紹介していきますので、slickをスマホのみ適用したい方はご参考にしていただければと思います。 目次 ・slickをスマホ時のみ動作させ...
JQuery コーディングJS lightcaseの使い方!!レスポンシブ対応のlightbox風ギャラリー 2020年7月7日 写真画像を拡大して見せるギャラリーについて、どのような物をお使いですか? 今回はlightboxに似たギャラリーで、レスポンシブ対応の動作が軽いlightcase.jsの使い方について紹介していきます。 実装がとても簡単なので、lightcase.jsを導入する参考にしていただければと思います。 目次 ・lightca...
JQuery コーディングJS スマホ画面のスクロールを禁止する簡単なJQueryコードの紹介 2020年7月3日 スマホのメニューやモーダルウィンドウが開いている際に指でスクロールすると、メニューやモーダルウィンドウの下のボディ自体がスクロールされたしまうようなことはありませんか? 別段サイト自体への影響はないのですが、基本的に気持ち悪い感じがしますよね。 大抵のクライアントの方には、ちょっとこれは改善して欲しいと言われる方も少な...
JQuery コーディングJS HTMLリンクでパラメータを渡しJQueryで受取処理をする方法 2020年7月2日 パラメータを使うと、Webサイトで処理できることがいろいろと広がります。 簡単なプログラミングを取り入れるだけでも様々なことができるので、Webデザイナーの方でも覚えておくと便利だと思います。 今回はそんなパラメータの使い方の基礎として、HTMLとJQueryを使って紹介していきます。 目次 ・HTMLリンクでパラメー...
JQuery コーディングJS動画 JQueryで動画の再生・停止の切り替えボタンを実装する方法 2020年7月1日 以前の記事でvideoタグの使い方について紹介しました。 デザインに拘る方はvideoタグのデフォルトのコントローラは、デザインがイマイチと思う方もいるかもしれません。そこで今回はJQueryを利用して、動画の再生・停止の切り替えボタンを実装する方法について紹介していきます。 目次 ・再生・停止の切り替えボタンを実装す...
JQuery コーディングJSレスポンシブJavascript HTML-クリッカブルマップをレスポンシブ対応する方法 2020年6月23日 クリッカブルマップを久しぶりに使おうと思うと、レスポンシブ対応ってどうするの? そう思うことはないでしょうか。 Web制作をしている方でもクリッカブルマップ自体が滅多に使わない人が多いので、いざ必要な時にわからない場合があると思います。今回はそうした方にむけて、HTMLのクリッカブルマップをレスポンシブ対応する方法を紹...