JQuery を使用して画像の元の幅を取得し、画像の幅が 700px を超える場合に条件付きで CSS を調整しようとしています。
このコードを使用して、画像の幅を取得しました。
var img = new Image();
img.src = $('#imageViewerImg').attr('src');
img.onload = function () {
var W2 = this.width;
alert(''+ W2);
}
Fiddle
警告ボックスに画像の幅 (この場合は 1024) が表示されていることがわかります。このコードをコピーして貼り付けると、私の Web サイトでは機能しません。アラートボックスが表示されないだけです。他の JQuery コードが機能するように、JQuery を適切に含めました。本来の機能を実行しないのは、この単純な JQuery の一部です。
最後に、これは私が作成しようとしている機能に必要なコードです。
var img = new Image();
img.src = $('#imageViewerImg').attr('src');
img.onload = function() {
var imgWidth = this.width;
}
if($imgWidth > 700) {
$("#photoHolder").css({"vertical-align":"none","text-align:":"none"});
}
警告ボックスが JSfiddle には表示されるのに、自分の PC には表示されないのはなぜですか?
また、document.ready 関数を使用しても、まだ機能しません。JQuery は単に実行されていません。