HOME > JavaScript > javascriptで画像を取り扱う際の注意

javascriptで画像を取り扱う際の注意

2013/05/27 2024/01/12 JavaScript 画像関連

javascriptで画像を取り扱う際に、

ちゃんと要素を指定しているのにも関わらず、

undefinedになることが多く、なんでやろ？　と

なったのでメモ。

結論としては、画像を読み込む前にjavascriptで

操作は出来ない。考えると当然だけどはまって

しまったので注意。

■例

//画像読み込み前なのでundefined

document.images["image_name"].style.display = 'none';

</script>

//画像読み込み後なのでOK

document.images["image_name"].style.display = 'none';

</script>

または、

function test(){

document.image_name.style.display = 'none';

}

</scirpt>

みたいにしておけば、大丈夫。

: バニラJS対応(jQuery非依存)の画像遅延読み込みライブラリ「lazysizes」の利用方法

あるサイトのコーディングデータを貰った際に「lazysizes」というJavaS ...

: バニラJS対応(jQuery非依存)の画像スライダー系プラグイン「Flickity」の利用方法

画像スライダーを設置する場合「slick」プラグインを利用することが多い。ただ、 ...

: CKEditor5(WYSIWYGエディタ)に画像アップロード機能を追加する方法

CKEditor5(ウィジウィグエディタ)に画像アップロード機能を追加したい。公 ...

: 「slick」でブラウザ幅がPCの場合はスライダーを表示し、スマホ幅の場合はスライダー無しにする方法

slickプラグインで画像スライダーを設置しているページがあり、PCのブラウザ幅 ...