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>

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

: ライブラリ等を使用せずファイルをドラッグ&ドロップでアップロードする方法

formにドラッグ&ドロップでファイルをアップロードする機能を実装する場 ...

: JavaScriptで画像読み込み完了のタイミングを検知する「imagesLoaded」ライブラリの利用方法

大き目のサイズの画像をページに設置すると読み込み完了まで時間がかかる。その画像が ...

: JavaScriptにてスワイプ可能なLightBox系ライブラリ「PhotoSwipe」の利用方法

あるサイトをWappalyzerで調査していた際に「PhotoSwipe」という ...

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

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