- ベストアンサー
画像のある部分にリンクをはりた～～～い
novaakiraの回答
可能です。クリッカブルマップと呼びます。 参考ＵＲＬをどうぞ。
関連するQ&A
- css 画像の一部分をリンクにしたいです
画像の一部分だけをリンクにしたいです。 margin と width と height で指定したエリアをマウスオーバーすると、指定した部分だけ画像が変わってリンクになるという動作をさせたいのですが、うまくいきません。 最悪、画像が変わらなくても指定した部分のリンクができれば良いのですが画像全体がリンクになっているため、全体画像の上でマウスを動かしていると、リンク時のマウスカーソルになったり通常時のマウスカーソルになったりを繰り返しています。 html と css は以下のような記述をしています。 <html> <head> <style type="text/css"> div#menu a:hover { display:block; background-image:url(img/headerimg02.jpg); background-repeat:no-repeat; margin: 50px 468px 250px 50px; width:200px; height:100px; text-align:center; text-indent: -2000px; overflow: hidden; } </style> </head> <body> <div id="menu"> <a href="hoge.html"><img src="img/headerimg01.jpg" width="718" height="400"></a> </div> </body> </html>
- ベストアンサー
- CSS
- 画像の一部分にリンクを貼りたい
私、ホームページビルダー６を使用しております。 さて、ページに画像を挿入して、その画像の一部分にだけリンクを貼りたいと思います。 たとえば、風景画像の中に写っている人のかぶっている帽子の部分にだけリンクを挿入するという感じです。よろしくお願いいたします。
- ベストアンサー
- ホームページ作成ソフト
- 背景が透明なリンクボタンで、透明部分からリンクをさせない方法
1.pngという背景透明なボタンを作り、そこからonmouseでリンクを含む3種類のjavascriptが走るようにしてありますが、それだけだと、画像の透明部分でもリンクとjavascriptが有効になってしまいます。 画像の透明部分にマウスがあるときは何も起こらず、透明でない部分にマウスが乗った時だけにリンクとjavascriptを実行させることはできませんか？ よろしくお願いします。 実際使用しているソースは次の通りです。 -------------------------------------------------- <img border="0" alt="1" src="images/1.png" onclick="location.href='1.htm'" onmousedown="bdown()" onmouseup="bup()" onmouseover="bover(); PP(1)" onmouseout="bout(); PC(1)" id="bimage"/> -------------------------------------------------- ボタンの周囲にアクティブを示す点線の枠を表示させたくないため、リンクにはあえてホットスポットや通常のリンクを使用していません。 よろしくお願いします。
- 締切済み
- HTML
- 一枚の画像に何箇所かリンクをはるにはどうしたらいいですか？
たとえば 一枚の画像に ゾウ キリンが描かれていたとします。 その一枚の画像じたいにはなにもリンクをはらず、ゾウとキリンにリンクをはりたいんです。 ゾウの絵の部分をクリックしたら別のページにあたらしい窓で飛び、キリンの絵をクリックしたらまた別のページに新しい窓で別のリンク先に飛びたいのですが、どうやってできるんでしょう？ フリーソフトでありますか？ それともソフトがなくてもできますか？ 初心者なので詳しく教えていただけるとうれしいです。
- ベストアンサー
- フリーウェア・フリーソフト
- 一つの画像？にいくつもリンク
仕組みが分からないのでカテゴリも違うかもしれません^^; たまーに見るのですが、 一つの画像？（か、どうかもあいまい）の中に 無造作にリンクがあり、マウスを合わせると場所に よってリンク先が違う画像ってありますよね？ あれの作り方の一つに枠無しのテーブルを使う方法がありますが、その方法だと四角しか出来ません。 形も場所も無造作で、一つの画像の中でリンク先が位置によって異なる画像はどうやって作ればいいのでしょうか。 説明が下手ですいませんm(__)m
- ベストアンサー
- HTML
- 背景画像をリンクにする？
タイトルの通りなのですが、よくブログなどにある、headerの部分を画像にしてtopへのリンクを張る方法が分かりません。 例えば森永卓郎さんのブログだと、タイトルの「つながるモリタクBLOG」の部分にリンクが張ってあり ブログのトップページに移動するようになっていますが、このクリックできる範囲を広げて、 緑色の背景画像の部分をクリックしても同じく移動できるように指定することはできませんでしょうか？ 単に画像にリンクを張るだけならできますが、背景にしてみたところ詰まってしまいました…。 よろしくお願いいたします。
- ベストアンサー
- CSS
- 一部分のリンクのCSSを無効にしたい
HP全体、リンクの箇所にカーソルを持って行くとバックの色が変わるように設定をしています。 （a:hover の ｂackground-color を設定） しかし、一部のロゴ画像で、背景が透明色のものがあり、そのロゴ画像にリンクを貼ると、画像までロゴのバックが変わってしまいます。 ロゴの画像は、ロゴの下に写真を配置しているため、透明色を白に加工しなおすことができません。 この画像にマウスをおいても、背景が変わらないように（下の写真が見えているように）したいのですが、よい方法がありますでしょうか。 何かございましたら、ご教授下さい。 よろしくお願い致します。
- ベストアンサー
- CSS
- HP 画像の一部にリンクでその部分のみ画像変化
ホームページを勉強し始めたものですが、今ヘッダーの画像の一部に”問い合わせ”ボタンのようなのがある状態ですが、マウスオーバーさせるとそのボタンの絵だけを画像変化させるようにするのにつまずいています。自分でやるとどうしてもヘッダーの画像にすこしでもマウスオンするとボタンがすでに変化用の画像に切り替わってしまいます。＜AREA＞を使ってみてもやはりリンクの部分だけでなく、画像全体に反応してしまいます。周りのホームページ詳しい人に聞いても、分かりませんでした。。。 実際のHTMLは下記の通りです。 <div id="header_pic"> <img border="0" src="../../img/元の画像.png" onMouseOver= "this.src='../../img/画像変化後.png'" onMouseOut="this.src='../../img/元の画像.png'" alt="事務所" width="980" height="130" usemap="#Map" /> <map name="Map"> <area shape="rect" coords="743,40,917,74" href="../contact/index.html" alt="問い合わせ"> </map> 画像の一部にリンクを設置し、その部分に乗った時だけ、その部分のみを画像変化させることはできないのでしょうか？ どなたかご教示お願いいたします。
- ベストアンサー
- ホームページ作成ソフト
- リンクさせると、そこだけ文字が大きくなってしまう
ホームページビルダーでサイトを作っているのですが、 スタイルマネージャーでリンクしている部分の下線を消す設定と、『マウスが上にあるリンク』を設定し、マウスがリンクの上に来たら文字の背景色が変わるようにしました。 するとプレヴューの画面だけでなく、ページ編集の画面でもリンクした部分の文字だけ大きくなっていることに気付きました。 そのため、表の配置が崩れてしまいます。 以前にほかのサイトを作ったときは、リンクしている部分の下線を消す設定をしましたが、文字の大きさは変わらなかったように思うのですが、背景色を変える設定をしたから文字は大きくなったのでしょうか？ 出来たらリンクの際の背景色を変えても文字が変わらないようにしたいのですが、どのようにしたらいいでしょうか？
- ベストアンサー
- ホームページ作成ソフト