人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

【javascript/Movable Type/Opera Mobile/解決で500pt】id属性にhogeという値を持つdiv要素の配下の、全てのimg要素の中で規定の最大サイズ(とりあえず300px)を超えるimg要素を最大サイズに縮小する、つまり

div#hoge┬ p - img(width:480px ○)
├ p - img(width:480px ○)
└ table - img(width:105px ×)
(○は幅300pxに縮小、×はそのままのサイズで)

ということを実現したいです。個人でやってるblog(Movable Type)なんですが、最近「iPhoneテンプレート for MT」というものを導入しまして・・・個別記事ページのimg要素を一括して縮小表示したいと。javascriptでできそうだと当たりをつけたのはよかったんですが、全くといっていいほど知識がありません。

このページ(http://tinyurl.com/6pesad)を参考に

<script language="javascript">
var img = document.getElementTagName("img");
if(img.getAttribute("width") > 300){
img.setAttribute("width",300);
}
</script>

以上のようなものを書いてみたんですが、動きませんでした。どなたかコードずばり、もしくはヒントだけでもください!。

上記のツリー図の構成は(http://tinyurl.com/63jms8)から例として引っ張ってきました。

●質問者: melondog
●カテゴリ:ウェブ制作
✍キーワード:blog hoge iPhone JavaScript Movable Type
○ 状態 :終了
└ 回答数 : 1/1件

▽最新の回答へ

1 ● Mars
●500ポイント ベストアンサー

こんなんでどうでしょう。

var IMG=document.getElementById('hoge').getElementsByTagName('img');
for(var i=0;IMG[i];i++) {
if(IMG[i].width > 300) {
IMG[i].style.width='300px';
IMG[i].style.height='auto';
}
}
◎質問者からの返答

うれしいです!動作しました!このコードを読めるように勉強しようと思います。

一つ教えて欲しいのですが、このスクリプトを記述する場所はHTMLの下のほう(img要素が出尽くした後)でいいのでしょうか。それとも外部ファイルとしてjsファイルを読み込ませてやった方がいいのでしょうか?

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ