• 締切済み

ランダム表示画像にリンクマップを貼れますか?

ページの上部に、ページが更新するたびに違う画像が 表示されるようにJavaScriptで記述をしているのですが、 その画像の数箇所に、別々のURLを貼りたいのです。 ランダム表示ではない通常の画像の場合、 それぞれの形に合わせてエリアを指定し、 リンクマップをすればいいと思うのですが、 ランダム表示をしている画像に対しては どうすれば良いのでしょうか? また、リンクを貼る部分をオンマウスオーバーするようにも したいのです。 このような事は可能なのでしょうか?

みんなの回答

回答No.1

要するにランダム画像におけるクリッカブルマップですね。 「mapタグにidを指定しておいて、画像ごとにinnerHTMLでareaタグごと書き換える」が使えるかと。 > また、リンクを貼る部分をオンマウスオーバーするようにも したいのです。 ちょっと良くわかりませんが、画像のロールオーバーを行ないたいということですか? onmouseoverで「特定のテキストを書き換える」ことはできますが、「画像の一部に特殊な効果を与える」ことはできません。

asako33
質問者

お礼

返事が遅くなり申し訳ございませんでした。 最終的には、見た目は1枚画像に見えるけど、実際の動きとしては、画像を上下で切り分け、 上部をランダムな動きにし、下部を固定でロールオーバーするようにしました。 どうもありがとうございました。

関連するQ&A

  • 画像からランダムリンク

    Javascriptでランダムリンクをする場合、 <form> <input type=button onClick="jump()" value="ランダム"> </form> <script> url = new Array(); url[0] = "00.html"; url[1] = "01.html"; url[2] = "02.html"; function jump() { p = Math.round(Math.random() * (url.length - 1)); parent.top.document.location = url[p]; } </script> という記述を使うのは知っているんですが、 「ランダムリンク」というボタンではなく、 画像をクリックしてランダムリンクさせることは可能でしょうか? Javascriptでは無理な場合、 画像からランダムリンクを張る方法はありますか? CGI等でも構いませんので、お勧めがあれば教えてください。

  • 複数の画像をランダムに表示させるソースを教えて?

    画像は50枚前後、画像といってもリンクバーで画像毎にそれぞれの違ったリンク先URLも指定したく、(target="_blank")なおかつ表示箇所はテーブル内のセル8箇所で、重複しないようにランダムに表示させたいです。と、XHTMLで書かれた既存ページで使うのでスクリプトは外部ファイル(js)にして、ページコード上では<body onload="____"><img id="~>等で読み込ませたいです。※XHTMLではname属性は使えません。また私はjavascriptについて全くの素人ですので、画像数、URL、パス等を書き換えるだけで直ぐに使えるソースが欲しいです。どなたか教えて頂けると幸いに存じます。

  • リンク画像のランダム表示について

    はじめまして。 諸先輩方、ご教授いただければと思います。 現在、JavaScriptでのリンク画像のランダム表示を、コーティングしてます。 配列に値をセットする方法は、存じてるのですが、対象のリンク画像が数十件あるため、全て記述するのはスマートではないと思い、とあるフォルダに対象のリンク画像を格納(1~50.jpg)し、取得したランダム値をもとに画像を表示させる所までは実装できました。 その際に画像へリンクを貼る段階で詰まってしまいました。 何か良い方法はないでしょうか? 私の考えでは配列にリンク情報を格納し、取得したランダム値をもとに取得するのかなと思ってますが、取得後のリンク設定方法がわかりません。 また、リンク画像を表示時、ロールオーバー処理も行いたく、外部jsファイルにロールオーバー処理を記述しました。 IEでは、問題なく表示されてますが、他のブラウザではロールオーバーが出来ません。 これは、リンク画像のランダム表示時にロールオーバー処理を追記する必要があるのでしょうか?

  • リンクと画像に触れると数カ所の画像が替わる

    わかりづらいかもしれませんので、例をあげながら質問いたします。 アルファベットのリンク画像にマウスが触れると、 同じ場所に読みであるカタカナの画像を表示させるためには、 オンマウスのタグを入れてあげればいいんですよね。 ところがもう一つ、別の場所(テーブル)に写真画像も入れ替えて表示させたいのです。 アルファベットのリンク画像がいくつかリストになっていて、 触れると同じ場所に読みの画像が入れ替わって教えてくれると同時に、 別のテーブルに1ケ所だけ写真サイズの画像のスペースがあり、 そこにリストに合わせた写真画像を入れてあげたいのですが。 オンマウスオーバーとオンマウスアウトを2個ずつ入れてあげることになりますが、 連動で数カ所の複数の画像を表示、非表示で入れ替えるのは可能なのでしょうか。 何度組み合わせても、ひとつしか替わらないのです。 別のテーブルにある画像を表示させるのにはHTMLで、 同じ場所にある画像を変化させるのにはリンク画像に触れるJavascriptを使いました。 オンマウスオーバーとオンマウスアウトの記述を 2つ並べて記述するのが間違ってるんだと思うのですが。 連動で同じ箇所と別の箇所に複数の画像を表示させてリストごとに替わる記述法があれば、ぜひ教えてください。 また、リンクに対するオンマウスではなく、 画像に対するオンマウスっていうのはあるんでしょうか。 知識不足で、しかも長文になり申し訳ありません。 お忙しいところ恐縮ですが、よろしくお願いいたします。

  • クリッカブルマップの部分的な画像の入れ替え

    HTMLの頁に大きな一枚の画像を貼り付け、クリッカブルマップで7か所にリンクボタンを作りました。マウスがリンクボタン上に来た時、そのボタンエリアにだけ違う画像を表示したいのですが、どなたかお教え願えないでしょうか?当方javascriptは初心者です。よろしくお願いします。

    • ベストアンサー
    • HTML
  • ランダムに表示する画像にリンク

    javascriptで、リロードするたびにランダムに画像を 表示するようにしている(画像は合計5枚)のですが、 ランダムに表示するように用意している画像の一枚一枚に 各画像バラバラのリンク先を設定することというのは可能なのでしょうか? また、可能であるのならその方法をお教え願えませんでしょうか。 よろしくお願い申し上げます。

  • 画像のランダム表示とリンク、alt属性について

    はじめまして。 検索かけてみましたが、自分の納得が得られる回答が無かったため、質問させていただきました。 ページを更新するごとに画像とテキスト(その画像の作成者などを書きたい)をランダムで表示させ、なおかつ他へリンクし、画像にはALT属性、テキストにはTITLE属性を付けられるJavaScript、もしくは、CGIを探しています。 可能であれば、画像とテキストを別々の場所へリンクしたいと思います。 このようなJavaScript、またはCGIを知っている方、ご教授お願いします。

  • JavaScriptでランダムに画像を表示させ、5秒ぐらいで画像は自動

    JavaScriptでランダムに画像を表示させ、5秒ぐらいで画像は自動切換え、さらにその画像にリンク先urlの指定のやり方をわかる方いらっしゃいましたら教えてください。 JavaScriptでランダムに画像を表示、5秒ぐらいで自動切換えまでは過去質問でわかったのですが、その画像にリンクさせる方法をお願い致します。 JavaScriptでランダムに画像を表示、5秒ぐらいで自動切換えまでは http://www.tagindex.com/kakolog/q4bbs/201/360.html こちらの質問内記載のタグを参照させて頂きました。 これに個々の画像にリンクをつけたいのです。 よろしくお願い致します。

  • 画像をランダム表示させたい

    画像を5枚横並びにランダム表示させたいです。 XHTMLとCSSでサイトを制作しようと考えています。 イメージフォルダに複数の画像データを格納、そこからアクセス毎にランダム(同じものが表示されないよう)表示。 画像をクリックすると指定したページにリンク。 下記URLページ右の真ん中あたりにある感じのものです。 http://picpi.net/main.html 方法としてはCGI、Javascriptなどいろいろあると思うのですが、まったくわからない人間です。 参考になるサイト、もしくは答えまで出して頂けると大変助かります。 以下、参考までにサーバ環境です。 perl5.8.、Ruby1.8.、Python2.4.、PHP4.4.、PHP5.1.、MySQL4.0.25、ColdFusion が使えるそうです。

  • ランダム表示された画像にリンクを張る方法

    Javaスクリプトで更新ごとにランダムで画像を表示させることはできたのですがそれにはリンクがつけられませんでした。ランダムで画像を表示させさらにそれぞれリンクをはる場合はどうすればよいのでしょうか?