• ベストアンサー

ホームページで、右下に固定されるロゴにハイパーリンクをつける方法

スタイルシートで、常に画面の右下にロゴなどの画像を表示させる方法(スクロールしても、ウインドウの大きさを変えても)がありますが、この画像にハイパーリンクを張ることはできるのでしょうか? できるとしたらその方法について教えてください。 このやり方については、下記をご参照ください:  http://www.hotwired.co.jp/webmonkey/98/24/stuff4a/logo.html

  • ami_j
  • お礼率100% (7/7)

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

  • ベストアンサー
  • sight
  • ベストアンサー率53% (199/370)
回答No.6

こんにちは。No.2、No.5、みたびです。 >実際にそういうページ存在するので、不可能なはずはないですから、がんばってください。 って書きましたけど、さすがにちょっと無責任な気がしたので、サンプルスクリプトのページをご紹介します。 画面右下にロゴイメージを表示する(DHTML) http://www.oitaweb.ne.jp/hp/tatsuya/java/banner.htm クロスブラウザを制する Part 2 2-7 位置固定 http://allabout.co.jp/computer/javascript/closeup/CU20010713/index.htm?FM=ct ご参考になさってください。

ami_j
質問者

お礼

すばらしい! まさに、こういうことです。 >>はじめからJavascriptでやれって!? 本当にありがとうございました、多謝。

その他の回答 (5)

  • sight
  • ベストアンサー率53% (199/370)
回答No.5

>「ただ単に壁紙を固定位置に貼るだけのテクニックでしかない...」というのは、誤解されていると思うのですが いえ、誤解はしていないと思っていますけれども。 もうちょっと正確に書くと、 「ただ単に壁紙を(連続媒体としてではなく)閲覧領域の固定位置に貼るテクニック」 ということです。 閲覧領域に対してですのでスクロールしてもウィンドウサイズを変えても常に定位置にあるのは確かです。 で、これ(閲覧領域に対して固定する)を(通常の要素に対して)実現するスタイルが、CSS2にはあるので、スタイルシートだけでできるんじゃないか??と思っていたんですよ。 position:fixed  で。 でも、申し訳ありません!! 確認していなかったんですが、CSS2なんてサポートされていないですね。 少なくてもIE5.01では使えなかったですし、ie6.0も完全対応を謳っているのはCSS1のレベル。 すみませんでした。 #ちなみに、floatは文章の流れ込みが可能になるのであって、周りの文章から独立したポジションをとれるわけではありません。周りの文章はfloat設定された要素の存在に影響されます。影響されないようにレイヤー状態にしてやる必要があります。 なので、現状ではDynamicHTMLやJavaScriptをつかって、(もちろんブラウザごとに場合分け処理もして)実現するしかないと思います。 実際にそういうページ存在するので、不可能なはずはないですから、がんばってください。 #たぶん、CSS1,JavaScript,IEとNNそれぞれの独自スタイルなDynamicHTMLすべてを駆使する必要があると思います

ami_j
質問者

お礼

>> で、これ(閲覧領域に対して固定する)を(通常の要素に対して)実現 >> するスタイルが、CSS2にはあるので、スタイルシートだけでできるん >> じゃないか??と思っていたんですよ。 >> position:fixed  で。 スタイルシートってすごいですね(というか、コンピューター技術そのものがすごいのかもしれないけど)。 わたしは最近その使い方を(ほんの少しだけ)理解して、虜にされてしまいました...。あまり懲りすぎるときりがないので程々にしたいと思いつつ、のめりこんでます(おかげで本来の仕事が手につかない!)。 でも、JavascriptやDHTMLなどとの使い分けなどについては実はよくわかってないので、まだまだ勉強不足は自覚してますが。 いろいろとありがとうございます。どういう方法にしろできることがわかったので、張り合いがもてました。

  • norizow
  • ベストアンサー率26% (32/120)
回答No.4

なるほどねー私も少し意図するところを誤解していました。 固定画像にリンクを貼る方法はわかれど、スクロールしても消えないとなると ちょっとわかりかねます。ごめんなさい。 そもそも例のURLのは、属性がbackgroundとなっている以上 これをいじってリンクをってのは不可能だと思います。 下の方がおっしゃっているようにスクリプトでなんとかなるかもしれませんが (画像固定ではなく常にロゴマークの小さなウインドウを手前に出すようにし、 そこにリンク貼るとか) 当方スクリプトは詳しくないので…(^^;) 現時点では無理でも、将来出来る様になるかも。位しか言い様がないですね。 アドバイスにならずにごめんなさいね。

ami_j
質問者

お礼

ありがとうございます。 今後ともよろしくお願い申し上げます。

  • norizow
  • ベストアンサー率26% (32/120)
回答No.3

URLに書いてあるのは、画像固定ではなく、 「背景画像を固定させる」やり方ですので、リンクを貼るのは無理だと思います。 スタイルシートで画像を固定させ、さらにリンクを貼るには スタイル内に img{ margin-top:固定させる数値+単位。以下同じ; margin-bottom:; margin-left:; margin-right:; } <body>内に <a href="リンク先アドレス"><img src="画像のアドレス"></a> と、するといいでしょう。

ami_j
質問者

お礼

ありがとうございました。 皆さんからのアドバイスは、非常に参考になります。 ...でも、意図するようなことはうまくできません。これはそもそもできないことをやろうとしているのでしょうか。 上記の方法も試してみましたが、どうもうまくいきません。それは私の書き方が間違っているのでしょうか、それとも本来的にできないことなのでしょうか...?

ami_j
質問者

補足

上記方法で試してみましたが、うまく書けてないのかもわかりませんが、 img{ margin-top:固定させる数値+単位; margin-bottom:(上に同じ、以下同じ); margin-left:; margin-right:; } では、画像の位置は固定されませんか? ウインドウの大きさによって可動な配置指定というのはできるのでしょうか?

  • sight
  • ベストアンサー率53% (199/370)
回答No.2

>このやり方については、下記をご参照ください: >http://www.hotwired.co.jp/webmonkey/98/24/stuff4a/logo.html 拝見しましたが、できないと思います。 というより、これを「常に画面の右下にロゴなどの画像を表示させるテクニック」というのはどうかなぁ?と思います。 これって、ただ単に壁紙を固定位置に貼るだけのテクニックでしかないですよね。壁紙の代わりにロゴを貼っているだけであって。 壁紙は、backgroundのプロパティの一つだと思いますから無理でしょう。 スタイルシートを使った「常に画面の右下にロゴなどの画像を表示させるテクニック」と言うならば、おそらく、positionなどを使って画像を含むブロック要素をフローティング要素にして、ブラウザの特定の場所に配置しておくようにするべきじゃないかと思います。この場合でしたら、普通にリンクなども張れますし。

ami_j
質問者

お礼

基本的には皆さんからのご回答をみると、バックグランド指定の画像にリンクをつけることはできないということで理解しました。 ありがとうございました。

ami_j
質問者

補足

「ただ単に壁紙を固定位置に貼るだけのテクニックでしかない...」というのは、誤解されていると思うのですが、わたしの理解が誤っていますか? 「固定位置に貼」られた画像の場合、スクロールするとページ全体といっしょに上下(または横スクロールの場合は左右)して、視界からやがて消えていきますよね。 ここ(http://www.hotwired.co.jp/webmonkey/98/24/stuff4a/logo.html)で示されている右下のロゴは、スクロールしてもウインドウの大きさを変えてもブラウザウインドウの右端についてきます(ウインドウサイズを変えてみてください)。 さて、 「positionなどを使って画像を含むブロック要素をフローティング要素にして、ブラウザの指定の場所に配置しておくようにする」 とのことでしたので、 なるほどと思い、floatプロパティを使って下記のように指定してみました。   img.float {float: right } 画像に、"float"というクラスを指定しました。 ところが、これだと確かに画像が右下に表示されるのですが、スクロールすると隠れてしまいます(つまり、ページの中で位置が固定されているわけです)。 教えていただいた方法とは違うことをしてますでしょうか? これを隠れないように、ページの中の位置として指定するのではなく、ブラウザのウインドウ上の位置として画像の配置指定をすることができるのでしょうか? 理解不足や誤解によって誤ったことをしている/書いている場合は、何卒ご容赦ください。

  • popon1
  • ベストアンサー率37% (12/32)
回答No.1

バックグラウンド指定をしてあるので、リンクを貼ることは出来ません。 右下に固定したものにしたい場合、JAVAで指定しましょう。

参考URL:
http://tohoho.wakusei.ne.jp/
ami_j
質問者

お礼

早速のご回答ありがとうございます。 JAVAというのは、Javascriptですね? スタイルシートもようやく少しわかりかけた(といえるのやら...?)ところですので、Javascriptにはまだまだ手が回りません...。 上にご紹介いただいた「とほほ...」は、ブックマークに入れているのですが、なかなかじっくりと読めないまま今日まできています。 もっと勉強しないといかんなあとは思うのですが。 いずれにしろ、ありがとうございました。

関連するQ&A

  • gooHPでの右下背景固定の方法。

    今日は。検索して調べてみたのですがヒットしなかった為、何方か分かる方、ご指南ください。 gooHPで背景固定はできたものの画像が右下固定用の小さいものなので、固定はできても同じ画像が一画面に分割されて表示されてしまいます。 右下に固定するのにスタイルシート?なるものがあるのは知っているのですが、それをgooHPの場合は何処に張ればよいのかがわかりません。デザインの所でもないようですしメインに書き込んでも駄目なようです。 以前から右下背景固定にしたいと思っているので是非今回こそはと質問させて頂きました。何卒、宜しくお願い致します。

  • 固定画像の右下に、ポイント画像を置くには?

    お教えください。 今、FRONT PAGE EXPRESSを使用しつつ、タグページで書き込み調整をしております。 お聞きしたいのは、 「背景画像をスタイルシートで固定した上に、もう一つポイント画像を一つだけ右下に固定したい」 のですが、どのようにしたらよいのでしょうか? 現在、下記のような状態です。 <html> <head> <style type="text/css"> <!-- body { background-image : url('○○背景画像.gif'); background-repeat:no-repeat ; background-attachment : fixed; background-position : right up ;} a{text-decoration:none;}--> </style> <meta http-equiv="Content-Language" content="ja"> <meta name="GENERATOR" content="Microsoft FrontPage 5.0"> <meta name="ProgId" content="FrontPage.Editor.Document"> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <title>△△</title> </head> ここにどのような手を加えると、右下に表示され、尚かつスクロール時も動かなくなるのでしょうか? 宜しく御願いします。

  • excelで画像のハイパーリンクをセル値参照できませんか?

    Excelにて画像(Jpg)をハイパーリンクにて貼付けしていますが、画像のファイル名をセル上の値と同じした時にハイパーリンク先を自動計算(演算)させる方法はどのようにすれば良いのでしょうか? シート上のA1セルの値:00001・・文字情報 ハイパーリンクしたい画像のファイルネーム:00001.JPG シート上のA2セルの値:00002・・文字情報 ハイパーリンクしたい画像のファイルネーム:00002.JPG 以下、A2、A3・・・・と続く ハイパーリンク先の参照先:(A1).JPGの様なイメージです。 これが出来れば、ドラッグして全ての行を同じ演算式にして参照 できるのかな?と思っています。

  • エクセルのハイパーリンクについて

    エクセルシートに目次を作って、ハイパーリンクで別のファイルを開くようにしているのですが、ハイパーリンクでジャンプする時、「新しいウィンドウを作る」とはならないんですよね。(右クリックで選択はできる) 常に新しいウィンドウで開くという設定はできないのでしょうか? よろしくお願いします。

  • エクセルのハイパーリンクについて

    エクセル2003を使用している者です。 ハイパーリンクに関しての質問です。 エクセル内で画像を複数貼り付け、縦に長く使用しているシートがあります。 そこで、各画像の一番左上に当るセル部分にハイパーリンクを使用して(同じエクセルファイル内ですが)画像にリンクする様に指定をしています。 シートの一番上に貼り付けてある画像は特に問題はないのですが、 例えばA25にLINK先を指定した時、A25が一番左上に表示される様に設定することが出来ますでしょうか。 何が言いたいのかといいますと、A25を指定したときに、LINKして飛んできたとき指定したA25が画面の真ん中辺りにあり、画像が半分程切れた状態になってしまうのです。 見栄えを考えたときに、指定した画像がLINK先から飛んできたときに綺麗に収まるように表示したいと考えたのです。 方法をご存知の方がいらっしゃいましたら、ご教授頂きたく思います。 過去に似たような質問があったら申し訳ありません。 よろしくお願いいたします。

  • Excelのハイパーリンクを効率的に…

    Excelのハイパーリンクに関しての質問なんですが、 同じ位置関係のハイパーリンクを一挙に作成することは出来るのでしょうか? 例えば、[Sheet1/A1]⇒[Sheet2/D1]というハイパーリンクを張ったとします。 次に[Sheet1/A2]⇒[Sheet2/D2]というハイパーリンクを張り、 続けて[Sheet1/A3]⇒[Sheet2/D3]のハイパーリンク、そして [Sheet1/A4]⇒[Sheet2/D4] [Sheet1/A5]⇒[Sheet2/D5] [Sheet1/A6]⇒[Sheet2/D6]…… というふうにハイパーリンクをず~っと張っていきたい場合 その作業をまとめてと言いますか、効率的に進めていく方法ってあるのでしょうか? 分からないので教えて下さい。よろしくお願い致します。

  • 画像の固定について

    ホームページをTAGにより作成しています。 閲覧するときにスクロールをしますが、その画面上たとえば最上部にバナーのようなものをおいて、スクロールしても常に画面上で見れることはできますか。 検索ですと「背景画像の固定」は、たくさんありますが、 単なる画像の固定というのがなかなかみつかりません。 このうち上に固定というのでためしてみたら、スクロールした場合、そのバナーがうしろに行ってしまい見えなくなってしまいました。 使用方法は、画面いっぱいに画像を表示させ、小さなバナーで「画像をクリックしてください」というのをおきたいのです。 一定のところにおくと、画像をスクロールさせて場合見えなくなってしまうのでこれを常に見えるようにしたいのです。 よろしくお願いします。

  • 1000個分のハイパーリンクを埋め込む方法

    エクセルで、セルのA1をクリックすると、ハイパーリンクで「.\0001.jpg」が開き、 セルA2をクリックすると「.\0002.jpg」が開き、 セルA1000をクリックすると「.\01000.jpg」が開くようにハイパーリンクを1000個分のセルに設定しようと思ってます。 1つ1つ手でハイパーリンクを埋め込んでいけばいいのですが、 それだと1000個分作業するのに時間がかかります。 簡単に1000個分のハイパーリンクを埋め込む方法はないでしょうか? ■環境 Excel2003 Windows7

  • ネットスケープ6.0以上でのレイヤー移動方法

    ネットスケープ6.0以上でレイヤーの移動を行いたいのですが、JavaScriptの記述方法がわかりません。 ieですと id.style.pixelLeft=document.body.scrollLeft の記述でうまく動作するのですが・・・ イメージ的には、 ページをスクロールしても画面の右下などに 常に画像がくっついて来るイメージです。 どなたかご教授くださいませ。

  • 【エクセル】ハイパーリンク先を固定したい

    エクセルで同一ファイル・同一シート内のあるセルにハイパーリンクを貼るとき・・・。 たとえば、A1を押下時にD6に移動するような設定にしたいのですが、 (1)「Ctrl + K」でD6を指定して普通にリンクを貼る。 (2)「=HYPERLINK("#Sheet1!D6","D6へ移動")」をA1に入力する。 この方法だと、A1とD6の間に列や行を挿入したり削除したりすると「D6」の位置がずれますよね・・・。 なので、1行挿入したらリンク先をD6からD7に追いなおすようなハイパーリンクの貼り方がありましたら、ご教示ください。 よろしくお願いします。