![](http://oshiete.xgoo.jp/images/v2/pc/qa/question_title.png?c9bd177)
現在、別々のリンクを設定された6つの画像(<a href="..."><img src="..." /></a>)から、3つを取り出して、表示するというJavaScriptを作っています。
この3つのリンクされた画像は最初からHTMLに書かれているとします。
これを、DOMを使って、その別々の名前のIDのdivの子要素のhref,srcを抜き出したデータで書き換えてます。
(document.getElementById('...').href=...というカンジで)
その際に、書き換えの関数をonLoadで呼び出してます。
その際、どうしても最初で表示されている画像などが見えて、書き換えが行われてしまいます。
関数の前に、そのdivをdisplay:noneにして、処理が終了後にdisplay:blockにしてますが、それでも前述のように、前の表示が出てきます。
書き換え後のみを表示させる方法を、CSSで最初からdisplay:noneにしておく以外で方法が分かる方、おられましたらよろしくおねがいします。
A 回答 (2件)
- 最新から表示
- 回答順に表示
No.2
- 回答日時:
<IMG> タグが最初からある前提であれば、無色透明のGIF画像を作って、初期状態のときだけそれを張っておくというのはどうでしょ
うか?この回答への補足
すいません、「リンクされた画像」だけでは、説明が足りませんでしたが、意味のある画像という意味で、透明GIFを張る事はできないのです。
補足日時:2006/04/13 14:00No.1
- 回答日時:
その画像を表示するスペースをテーブルなりエレメントなりを使って予め開けておき、中に<SPAN>タグを入れて動的に<IMG>タグを記述すればいいのではないかと思います。
具体的には、たとえば100×100の大きさの画像を表示するとすれば、
<TABLE WIDTH=100px HEIGHT=100px><TR><TD>
<SPAN ID="img1"></SPAN></TABLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
switch ( Math.floor(Math.random() * 3) ) {
case 0:
document.all.img1.innerHTML = '<IMG SRC="a.jpg">';
case 1:
document.all.img1.innerHTML = '<IMG SRC="b.jpg">';
case 2:
document.all.img1.innerHTML = '<IMG SRC="c.jpg">';
}
//-->
</SCRIPT>
とまぁ、こんな感じ。(↑デバッグしてません)
画像は<SPAN></SPAN>の内側に表示されるわけです。
参考にしてみてください。
この回答への補足
ご回答、ありがとうございます。
あと、すいません前提として、IMGタグは最初からある、というので、その際はinnerHTMLで入れ込むとしても、先に入ってるIMGタグはその後、display:noneにしても、希望通りに動くのでしょうか?
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS CSSが効かずどのように指定すれば良いか分からないのでアドバイスお願い致します 2 2023/06/07 12:25
- HTML・CSS HTML & CSS 縦ボックス内の文字の左右センタリング 3 2023/03/25 04:23
- HTML・CSS 書籍を見つつサイト造りの練習をしているのですが、見た目が一致しません 2 2022/11/28 15:00
- HTML・CSS ボタンをクリックした時に、入力フォームのすぐ下部に、「入力欄が空白です」というテキストメッセージが表 1 2022/04/27 16:25
- HTML・CSS ヘッダーの画像にメインエリアがかぶってしまいます 1 2022/11/28 14:06
- HTML・CSS flex の各子要素を横幅 100% にしたい 1 2022/09/22 21:25
- JavaScript jQueryで同じクラス名のものを別物として扱いたい 1 2022/06/17 14:14
- HTML・CSS テキストを画面の真ん中に配置したいです。 2 2022/11/25 16:11
- JavaScript アップロードファイルの種類によって処理を分岐させたいのですが書き方が分からずアドバイスお願いします 4 2023/06/17 19:12
- JavaScript 入力フォームの javascript で メールアドレスの正規チェックをを行い、ボタンをクリックして 2 2022/04/27 16:06
関連するカテゴリからQ&Aを探す
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
FC2ブログで、画像の画面中...
-
ビットマップ(bmp)形式で背景...
-
<td>中の文字列に<p>は必要?
-
編集が出来ません(JPEGフ...
-
PDFの一部を消す
-
画像の背景の透明部分だけを広...
-
HTML 表の上に文字がきてしま...
-
文章が読みやすいのは?
-
直接リンクと間接リンクの違い
-
YYMMDD
-
直リンについて
-
「ペイント」で.JPG保存ができない
-
フォトショップでBMPファイルが...
-
文字をクリックするとリンク先...
-
サムネイルをクリックで拡大す...
-
ホームページで他のページに飛...
-
デジカメで撮った集合写真に写...
-
お札画像の素材集を加工してWeb...
-
投稿できません。不正な書式?
-
デジカメで撮影した集合写真に...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
FC2ブログで、画像の画面中...
-
HTMLプログラミングについて
-
アメブロで画像が拡大表示でき...
-
画像の位置を変えるタグについ...
-
【HTMLタグ】画像を横に連...
-
楽天ブログで画像の右に回り込...
-
アメブロ サイドバーに動く画...
-
画像の外枠
-
バーナー自作??、著作権の質問...
-
【アメブロ】フリープラグイン...
-
ブログの画像を中心におきたい...
-
ブログで動く画像
-
画像リンクでの余白を消したい....
-
楽天アフィリエイトのHP作成...
-
FC2のバナーの設置について
-
楽天ブログで画像を横に並べて...
-
バナー画像だけ表示されない・・・
-
ホムペのタグについて
-
シーサーブログでタグのコピー...
-
ブログの画像を横並びにUPしたい
おすすめ情報