• ベストアンサー

<EMBED>タグのSRCの値のみ変更

いつもお世話になります。 <EMBED>タグのSRCの値を変更する方法は、 http://oshiete1.goo.ne.jp/qa3208428.html で紹介されていました。 SRCの値のみを変更する方法はないものでしょうか。 上記で紹介されている方法は、同時に他の属性も含めて全て書き直しているものだと理解します。そのためかどうかの原因まではわかりませんが、画像を変更すると、画像を表示するエリア全体が一度一瞬消えてまた書き直されます。 SRCの値のみ変更すれば、別の画像への切り替わりがスムーズに行くような気がするもので。 よろしくお願いいたします。

質問者が選んだベストアンサー

  • ベストアンサー
回答No.1

document.getElementById()を使えばURLの一部書換が簡単です。例えばsrc値だけ書き換えるばあいは document.getElementById(ID).setAttribute("src","新しい名前"); というようにsetAttribute()を使えば出来ます。 しかし、そもそも、 > SRCの値のみ変更すれば、別の画像への切り替わりがスムーズに行くような気がする という事は無い筈です。書き換えた時点でソース先を読込みに行って、ある程度読込まれた時点で表示がはじまると思いますので。 もしスムースに切り替わりをしたいならば、見えないところで読込んでおいて（display:none 等で不可視）、切り替えの時点で重ねるようにすれば良いと思います。つまり、レイヤーを２枚用意しておいて、いっぽうを見えない状態にしておいて読込ませ、切り替えの時に表示を逆にすれば良いわけです。 参考まで。

rqg2010
質問者

お礼

taketan_mydns_jpさん、レスありがとうございます。 早速いろいろと試してみました。 どうも、思うように画像ファイルが切り替わりません。 setAttributeについて、調べてみたら、 IEでのgetAttribute,setAttributeのバグ http://javascript-memo.seesaa.net/article/26138927.html なんてのがあったので、これを参考に document.getElementById(ID).src=Src; としてみましたが、やはりだめでした。 IDは、 <EMBED id="ID" ・・・/> で定義したものです。

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. JavaScript

関連するQ&A

  • embed要素のsrc属性の値を変更するには

    JavaScriptを使って、embed要素のsrc属性の値を変更するにはどのようにすれば良いのでしょうか？ 具体的には、 <embed src=aaa.swf name=swf></embed> 現在上記のようにswfファイルを埋め込んでいるのですが、 これを <embed src=bbb.swf name=swf></embed> に変更するボタンを作りたいと思っています。 <input onclick=document.swf.src="bbb.swf"> と書いて実行してみたのですが、動作しませんでした。 ご教示ください。よろしくお願い致します。

  • embed　タグを用いると表示が遅い

    いつもお世話になります。 <embed src="・・・.mid" style="width:300px;height:30px;margin-right:10px;" autostart="FALSE" loop="TRUE" save="TRUE"> などとするとウェブページから音楽を聞くことができるようになりますが、このembedタグを用いると該当のページの表示が著しく遅くなってしまいます。 何か設定がおかしいのでしょうか。 また、代替の方法はございませんでしょうか。 よろしくお願いいたします。

    • ベストアンサー
    • HTML
  • OBJECTタグやEMBEDタグの属性値をFlashで表示したい。

    たとえば、以下のようなHTMLがあったとします。 <EMBED src="aaa.swf" quality=high WIDTH=320 HEIGHT=240 TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" title="ABC" units="EN"> </EMBED> Flashファイルaaa.swfを再生するのですが、EMBEDタグの属性値(WIDTH=320等)を取得してswfファイル内で表示したいのですが、可能でしょうか(aaa.swf内で「属性：WIDTH=xxx HEIGHT=yyy .....」という文字列を表示したいのです)。 もし可能ならどのようにやるのか教えていただけないでしょうか。

    • ベストアンサー
    • Flash
  • <img src=http://にしたい

    PHPでWebページのソースを取得して そのソースの中の<img>タグの src属性がもしhttp://で始まらなかった場合 取得したURLをsrc属性に加える方法はないでしょうか？ 例 URL=http://www.○○.com ソース <img src="/image/01.jpg"> ↓ <img src="http://www.○○.com/image/01.jpg"> に変更したいです。 よろしくお願いします。

    • ベストアンサー
    • PHP
  • JavaScriptで変更した属性の元の値の取得

    いつもお世話になっております。 ページの画像をとある条件で変更しようとしております。 HTML5のdata-を利用して変更後の画像のパスをimg要素内に持たせております。 JavaScriptでimg要素を取得し画像の変更は実現できております。 その後もとの画像に戻したいのですが、JavaScriptでimg要素を取得してもsrc属性が変更後の値になっており変更前の値が取得できません。 変更前の値の取得方法を教えてください。 ■HTMLソースの一部 <p><img src="img/moto.gif" alt="" data-mimage="img/ato.gif"></p> ■JavaScriptの一部 function wid(){ var image=document.getElementsByTagName('img'); if(window.innerWidth>=320){ for(var i=0;i<image.length;i++){ image.item(i).src=image.item(i).getAttribute("data-mimage"); } }else{ // ここに元の画像に戻すためのスクリプトを書きたい } } } wid関数を作ってそのなかでimg要素を取得し、条件を満たしたらすべてのimg要素のdata-mimageの属性値を元のsrc属性に上書きします。 次に条件が満たされていない場合はHTMLにもともと書いてあったsrc属性の属性値をsrc属性値に戻したいのですがこの値が取得できません。 img/moto.gifをimg/ato.gifに変更することは出来ます。 img/ato.gifに変更した後img/moto.gifに戻すことが出来ません。 もちろんdata-mimage2="img/moto.gif"を追加すれば可能なのは分かっていますが、現状のHTMLを変更することなく実現したいです。 よろしくお願いします。

  • embedタグでFirefox右クリック禁止

    ホームページで動画配信しています。 objectタグだけでは読み込めないブラウザがあるためembedタグを挟み込んでどのブラウザでも読み込めるようにしてます。 firefoxはobjectタグは無視していて、embedタグで表示されますが、動画上で右クリックをするとパスが表示されてしまいます。 これを表示させない方法はないでしょうか？ firefox対応の右クリック禁止javascriptを使用したところ、ページでは大丈夫でしたが動画上では無効でした。 http://okwave.jp/kotaeru.php3?q=1375996のページのように 画像を載せるやり方をやってみましたがfirefoxでは意味がありませんでした。

    • ベストアンサー
    • HTML
  • IMGタグのsrcを同時に変更することができない

    radioボタンを押すと画像をそれぞれ切り替えるものを作りたく、試してみたのですが思うように動きません。最後のiB.children[i].src = vvv[j] + ".jpg";が１つのIMGタグに対してしか効いていないせいのようです。複数のIMGタグのsrcも同時に変更していきたいのですがどのようにしたら良いのでしょうか。 <html xml:lang="ja" lang="ja"> <head> <title>radioボタンを押して3×3パターンの画像を切り替える</title> <script type="text/javascript"> function imgChange(evt){ var t = evt.target || evt.srcElement; if(t.nodeName != "INPUT") return; var inp = t.parentNode.getElementsByTagName("input"); var nnn = [], vvv = []; for(i=0; node=inp[i++];){ if(node.type == "radio" && node.checked) { nnn.push(node.name); vvv.push(node.value); } } var iB = document.getElementById('imgBOX'); var iBlen = iB.children.length; for(i=0; iBlen>i; i++){ //処理前のalert alert("before : src = "+iB.children[i].src); //IMGタグのsrc通りの結果に。 if(iB.children[i].tagName != "IMG") continue; for(j=0, node=nnn[j]; inp.length>j; j++){ if(iB.children[i].name == node){ iB.children[i].src = vvv[j] + ".jpg"; } break; } //処理後のalert alert("after : src = "+iB.children[i].src); //一番最初のIMGだけが変更され、残りは変更されず。 } } </script> </head> <body> <form action="#" onclick="imgChange(event);"> 画像Ａの切替⇒ <input type="radio" name="imgA" value="3" checked /> <input type="radio" name="imgA" value="4" /> <input type="radio" name="imgA" value="5" /> <br /> 画像Ｂの切替⇒ <input type="radio" name="imfB" value="6" checked /> <input type="radio" name="imfB" value="7" /> <input type="radio" name="imfB" value="8" /> <input type="radio" name="imfB" value="9" /> <input type="radio" name="imfB" value="10" /> <br /> 画像Ｃの切替⇒ <input type="radio" name="imgC" value="11" checked /> <input type="radio" name="imgC" value="12" /> </form> <p>----------------------------------</p> <div id="imgBOX"> 画像Ａは<img width="20" src="0.jpg" name="imgA" alt="画像Ａ" /> <br /> 画像Ｂは<img width="20" src="1.jpg" name="imfB" alt="画像Ｂ" /> <br /> 画像Ｃは<img width="20" src="2.jpg" name="imgC" alt="画像Ｃ" /> </div> </body> </html>

  • <img src=

    いくつかの画像を表示させたいのですが・・ <img src="１番目の画像URL"border="0"><img src="２番目の画像URL"border="0"> とタグを貼ると、画像同士がピッタリくっついてしまいます、 この間隔を開ける方法？ いろいろ調べていますがみつかりません・・ 普通にスペースを入れたら[＿]表示になってしまいました、 間隔を開ける方法を教えて下さい。お願いします・・

    • ベストアンサー
    • HTML
  • タグについて

    二つ質問があります。 とあるリングに参加してナビゲーションバーを設置しようとしています。ブログ（gooブログアドバンス）のページ幅の関係で、どうしてもこのナビゲーションバーの左側にブログタイトルがくるように設置したいのですが、タグの書き方が分かりません。http://www.tagindex.com/index.htmlで調べてみると、<IMG SRC="■■■" ALIGN="right">を使うと画像の左側に文字がくるように出来ることまでは分かりました。普通の"■■■.jpg"の画像だと希望通りの位置にタイトルと画像が設置される事は確認済みなのです。今私が設けたいナビゲーションバーのタグが、 <IMG src="http:　■■■.gif" width="300" height="100" border="0" usemap="#ringbn"> <MAP name="ringbn"> <AREA shape="rect" coords="60,12,293,53" target="_top" href="http://www.prionde.co.jp/chuo1/miz/webring/■■.html"> <AREA shape="default" nohref> </MAP> と物凄く長くて（ここでは省略しています）たくさん<　　>があり、このタグと<IMG SRC="■■■" ALIGN="right">をどうくっつければ良いのか分かりません。 二つ目は、試しにこのナビゲーションバーを適当な位置に埋め込んだところ、プレビュー時にはちゃんと設置できているにも関わらず、もう一度自分のアドレスからブログを見てみると、ナビゲーションバーと、先ほど上記に記したタグとがバラバラになって表記されているのです。バーの下にタグがずらっと並んでいます。驚きました。何故でしょう？ ＨＰを持っていたときはビルダーに頼りっぱなしだったので、ブログでのカスタマイズに戸惑っています。どうぞ宜しくお願い致します。

  • 固定タグ内の画像サイズの変更

    こちらにあるようなタグを、前後を変えることで画像を拡大（縮小）させることは出来るでしょうか？ ■の部分に入れるようにするだけで、挟まれたタグ自身は変更できません。 よろしくお願いします。 　（例）■<img src="/test.gif">■

    • ベストアンサー
    • HTML

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する