CSSを使って画像をクリックすると別フレームに大きな画像を表示したい

Question

よろしくお願いします。

JAVAとか使うと警告メッセージが表示されるので、そういったメッセージが出ないcssをつかって次のようなことがやりたいのですがどうぞ教えてください。

フレームで2つに割ったページで、左にサムネイルを表示しておいて、そのうえにカーソルを持っていくだけで右のフレームに大きな画像を表示させたいのです。

よろしくおねがいします。

345itati · Accepted Answer

参考先に上げられたサイトさんはCSSのhoverという動的疑似クラスをうまく利用されているみたいですけど。
(マウスポインタが上にある時に適用するCSSの書式を変える

ただ、恐らくこのやり方では複数のページにまたがってやるのは無理だと思います。

参考にあげられた先のページでしっかり解説されていますけど^^;(英語でソースを明示してくれているだけだけど
ソースを見て何をしているのかが分らないようだと、ちょっと応用は厳しいと思いますが・・・・。

koutarou504 · Answer

＃１，＃２の方の礼文で参考に提示された物は、うえにカーソルを持って行った時にそれ自身を変えているだけです。
擬似クラスにより、Ａ要素に対して指定しているだけです・・・。

故に、御希望の他の要素とか他のページに対しての変化を指定する事は出来ません。
諦めるしかないです。

まぁ JavaScript を用いたとしても、閲覧側が無効にしていたりといろいろ配慮が必要だし・・・。
結局、「そのうえにカーソルを持っていくだけで」という機能はまずは諦めて基本形を作成し、その上でオプションで付加するか検討されては如何でしょうか。
当然、付加した機能は一部の人しか使えませんが・・・。

k0021 · Answer

>JAVAとか使うと警告メッセージが表示されるので、そういったメッセージが出ないcssをつかって次のようなことがやりたいのですがどうぞ教えてください。

ツール→インターネット　オプション→詳細設定→マイコンピュータでの、CDのアクテイブコンテンツ実行を許可する　にクリックする　適用をクリック　すれば上記メッセジは出ないよ

Phoebastria · Answer

質問内容にあるような事はCSSで出来ないと思います。
というかそういう事はCSSでやる事ではないです。

情報＝html
デザイン＝CSS
上記以外特殊な事＝java、Flash

という感じでしょうか。

345itati · Answer

CSSはデザインを受け持つために使われるので、リンクのような動的な効果は出来ないと思いますが。

質問文のような事をしたいならJavascriptが必要です。

ちなみにローカルにあるjavascriptを使ったページをIEで確認をかけると、いちいち警告が出るのはIEのセキュリティ仕様です。実際の動作確認はサーバに転送してみないと分りません。

→http://www.tohoho-web.com/lng/200004/00040097.htm
こんな自己解決例がありますけど
(確認していないのでFirefox等でうまく動作しないかもしれない

CSSを使って画像をクリックすると別フレームに大きな画像を表示したい

参考先に上げられたサイトさんはCSSのhoverという動的疑似クラスをうまく利用されているみたいですけど。

＃１，＃２の方の礼文で参考に提示された物は、うえにカーソルを持って行った時にそれ自身を変えているだけです。

>JAVAとか使うと警告メッセージが表示されるので、そういったメッセージが出ないcssをつかって次のようなことがやりたいのですがどうぞ教えてください。

質問内容にあるような事はCSSで出来ないと思います。

CSSはデザインを受け持つために使われるので、リンクのような動的な効果は出来ないと思いますが。

似たような質問が見つかりました

関連するカテゴリからQ&Aを探す

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング