2021-07-01から1ヶ月間の記事一覧

文字アニメーションをスクロールに合わせて発動する

文字アニメーションをスクロールに合わせて発動する 実装方針 htmlの’animate-title'が画面内に入ってきたタイミングでTextAnimationクラスのanimateメソッドを実行したいので,監視対象を’animate-title'にする今回の場合複数存在するのでquerySelectorAll…

スクロール検知 IntersectionObserver

スクロール検知 IntersectionObserver IntersectionObserverというクラスはオプションをとることもできる。オプションをオブジェクトリテラルで定義して,IntersectionObserverの第2引数に格納する <使えるプロパティ>root:交差対象とする親要素 基本的…

Classを使ったコードの整理方法 クラスでコードの再利用性を高める

Classを使ったコードの整理方法 クラスでコードの再利用性を高める 上のように 同じことを繰り返し記述するのはプログラミングでは望ましくないので,関数にまとめるか,クラスというブロックにまとめて記述する。 「class クラスの名前」 で定義する クラス…

文字列をHTMLタグに分割

文字列をHTMLタグに分割 下の文字分割の部分をJavaScriptのDOM操作によって行ってみる 上を下のように変更まだ文字分割されていないのでアニメーションしない 文字列が複数になった場合を考えてみる PLAY ANIMATIONとしてみる PLAYとANIMATIONの間の半角スペ…

画面初期化時にコードを実行!DOMContentLoaded  vs  load

画面初期化時にコードを実行!DOMContentLoaded と load というふたつのイベントリスナーのちがいについて <DOMContentLoaded> HTMLをブラウザが解釈してDOMツリーを作成し終わったタイミングで発火するイベント <load> そのあとの HTMLからDOMを作成し終わったあとに,さらに画像や</load></domcontentloaded>…

DOMにイベントを登録

DOMにイベントを登録 JavaScriptにおいてイベントとはウェブサイト上で発生するあらゆるアクションのこと。ボタンをクリックする・ホバーする,テキストを入力するなどあらゆる行為がイベントとしてブラウザ上では認識されその状態を監視しているものをイベ…

DOMの操作

DOM(Document Object Model)とは? HTMLをJavaScriptから操作できるようにしたインターフェイス。JavaScriptからはDOM APIを通じてHTMLの情報を取得・変更する。情報の取得・変更・イベントの登録などができる。

配列とreduceメソッド

配列とreduceメソッド

配列とforEachメソッド

配列とforEachメソッド

コールバック関数とループ処理

コールバック関数とループ処理

コールバック関数

コールバック関数についてのメモ

アロー関数

アロー関数についてのメモ

IntersectionObserver

IntersectionObserver:スクロールに応じてJavascriptを実行させるクラス。 難しかったので自分用にメモを作っておきたいと思います。

行き詰まりを感じていますが・・

プロゲートのあと, Udemy の講座 www.udemy.com を受けています。 これ,19.5時間の講座なのに1000円ちょっとで買えました!!! 定価は8000円超えるくらいなんだけど セール期間を狙えばすごく安いので まだ試していない人は受けてみるといい…