CATEGORY

JavaScript

  • 2022-04-08
  • 2024-11-25
  • 0件

失敗談から学ぶJavaScriptの「let」と「const」と「var」と「スコープ」のお話。

変数を宣言する際に以前はvarを使用していましたが、JavaScriptのバージョンアップに伴って、今後はは「let」または「const」になっていくと聞いたことがあったので、「var」は使用しないようにしていました。 ですが、パラパラマンガを作成する過程で変数宣言の「var」は必要不可欠であったお […]

  • 2022-03-30
  • 2024-11-25
  • 0件

【jQuery】パラパラ漫画の画像に拡大・縮小、画像移動の機能を追加した。

前回は パラパラ漫画にスクロールバーを設置しました。 今回は画像に拡大や縮小と画像移動の機能を追加させました。 参考サイトは以下になります。〇imgViewer2.jsを使って画像の拡大縮小機能を実装する【マウスホイール・拡縮ボタン】 完成コードは以下になります。 「imgViewer2」を使用する […]

  • 2022-03-29
  • 2024-11-25
  • 0件

【jQuery】パラパラ漫画にスクロールバーを設置してみた。

前回は jQuery の環境構築についてお話ししました。 〇【JQuery入門】環境構築の方法。 「jQuery」はJavaScript初心者が高度な処理を行うための必須スキルだと思います。 今回はスライドバーを設置して、スライドを動かすと画像がめくれるように実装しました。 完成コードは以下になりま […]

  • 2022-03-12
  • 2024-11-25
  • 0件

【JQuery入門】環境構築の方法。

jQueryはJavaScriptのライブラリです。 ライブラリを導入することで、初心者でも簡単に高度な処理が行うことができるようになります。 ①「Jquery」のダウンロードページを開きます。  〇Jquery ②「Download jQuery」をクリックします。 ③「Download the […]

  • 2022-03-06
  • 2024-11-25
  • 0件

【パラパラ漫画】マウスのホイールで画像をコマ送り/戻りをさせる。

前回までのパラパラ漫画作成シリーズは以下のようになります。〇【ワードプレス】JavaScriptを使用してボタンをクリックするとポップアップを表示させる。〇【ワードプレス】JavaScriptの正しい書き方は?〇【ワードプレス】JavaScriptでページをコマ送り・戻りさせた。〇【JavaScri […]

  • 2022-03-05
  • 2024-11-25
  • 0件

【JavaScript】マウスのホイールと「パッシブリスナ」と「preventDefault」とブラウザのデフォルト処理について。

前回は一つのボタンでパラパラマンガの再生と停止をできるように実装しました。 〇【JavaScript】1つのボタンでパラパラ漫画の再生/停止をやってみた。 今回はJavaScriptのイベントである「touchmove」や「wheel」イベントを使用する場合の必須の知識をご紹介します。 例えば、以下 […]

  • 2022-03-04
  • 2024-11-25
  • 0件

【JavaScript】1つのボタンでパラパラ漫画の再生/停止をやってみた。

前回はパラパラ漫画で必須の写真のコマ送りを実装しました。 〇【ワードプレス】JavaScriptを使用してページをコマ送り・戻りさせた。 今回は一つのボタンでパラパラ漫画の再生と停止を行いたいと思います。 以下のコードは作成途中で書いていたコードです。 スクリプトタグ内のコードは以下になります。 / […]

  • 2022-03-02
  • 2024-11-25
  • 0件

【ワードプレス】JavaScriptの正しい書き方は?

前回の記事でワードプレスのブログでJavaScriptを動作させてみました。 〇【ワードプレス】JavaScriptを使用してボタンをクリックするとポップアップを表示させる。 しかし、これではjavascript のコードが長くなれば、見ずらいコードになります。 そこで、HTML内にスクリプトタグを […]

  • 2022-03-01
  • 2024-11-25
  • 0件

【ワードプレス】JavaScriptを使用してボタンをクリックするとポップアップを表示させる。

完成コード 実行結果 クリックしてください 解説 HTMLの<button>タグを使用して、「クリックしてください」というボタンを作成しました。 「onclick属性」を使用しています。 onclick属性は、要素がクリックされた際に発生するイベントの処理を設定するための属性です。属性値 […]