• ベストアンサー
※ ChatGPTを利用し、要約された質問です(原文:画像選択時の反転させるJAVAスクリプト)

画像を選択した時の反転方法について

このQ&Aのポイント
  • ホームページで画像を選択した時に(カーソルのせた時に)アクションを与えるための、画像をフォーカスさせる方法について教えてください。
  • 画像をカーソルオーバーした時に斜になったりする効果も含めて、見た目が良い方法を探しています。
  • 対象はWindows7を使っているほとんどのブラウザです。他に類似した方法やより良い方法があれば、教えていただきたいです。

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

  • ベストアンサー
  • sub_sub
  • ベストアンサー率65% (15/23)
回答No.2

画像を薄くするという形であれば、 CSSの  hoverを利用すれば如何でしょうか? <div class="image_area"> <img src="ランダムで表示される画像"> </div> というかんじで、 とりあえず DIVで囲んで CSSの方に、 hoverを設定すれば良いかと。 詳しくは http://web-flash-nagoya.ag-cleaner.com/web/161.html をご覧ください。 追加で質問があればお気軽にどうぞ!

yu_ray2007
質問者

お礼

ありがとうございます。 CSSでも出来るんですね。 やってみたいと思いますありがとうございました。

全文を見る
すると、全ての回答が全文表示されます。

その他の回答 (1)

  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.1

>選択されている事を明瞭にしたいと思っています。 どのような形で明瞭にしたいのかによりますが、枠線をつける、バックグラウンドを変える、サイズを変える、透明度を変えるなどであればCSSのhoverを用いれば比較的簡単に実現できるのではないでしょうか? アニメーション的なことをやりたいとなると、スクリプトの方が向いているかも知れませんが…

yu_ray2007
質問者

補足

ありがとうございます。 枠の色付とかではなく、画像を薄くしたりしたいので。 今まで数マイだったので、onmouse等で画像を準備していたのですが、大量なので画像を準備出来ないので、スクリプトで無いものか探しています。 よろしくお願いします。

全文を見る
すると、全ての回答が全文表示されます。

関連するQ&A

  • javascriptを使って画像のランダム表示とロールオーバーをセット

    javascriptを使って画像のランダム表示とロールオーバーをセットで行いたいのですが上手くいきません… javascript超初心者です…。画像をランダムに表示し、さらにそのランダムに表示された画像をそれぞれ違った画像にロールオーバーさせたいのですが上手くいきません。 一応以下のように書いて試しているのですが、ランダム表示はするのですが、ロールオーバーはエラーがでてしまい画像が切り替わりません。どのようにすれば上手く出来るか、知恵を貸してください。宜しくお願いします。 <html> <body> <SCRIPT language="JavaScript"> <!-- // ランダムに画像を表示する img = new Array(); onMouseover = new Array(); onMouseout = new Array(); // 画像のアドレス(数字はジャンプ先のアドレスと対応) img[0] = "top1.gif"; img[1] = "top2.gif"; img[2] = "top3.gif"; img[3] = "top4.gif"; img[4] = "top6.gif"; // マウスオーバー onMouseover[0] = "top1roll.gif"; onMouseover[1] = "top2roll.gif"; onMouseover[2] = "top3roll.gif"; onMouseover[3] = "top4roll.gif"; onMouseover[4] = "top6roll.gif"; // マウスアウト onMouseout[0] = "top1.gif"; onMouseout[1] = "top2.gif"; onMouseout[2] = "top3.gif"; onMouseout[3] = "top4.gif"; onMouseout[4] = "top6.gif"; n = Math.floor(Math.random()*5); document.write("<img src='"+img[n]+"' border='0' onMouseover='"+onMouseover[n]+"' onMouseout='"+onMouseout[n]+"'>"); //--> </SCRIPT> </body> </html> 補足 ●ランダム用の画像が1~5まで、ロールオーバー用の画像がa~eまであるとして、ランダム表示によって1が表示されたらロールオーバーで表示される画像はaのみ、マウスアウトしたら1に戻る、というようにしたいです。同じように2-b,3-c…というように対応させたいです。 ●ページ読み込み時のみランダム用画像をランダム表示させ、後は上記のような流れにしたいです。 長くなりましたが、どなたか回答お願いいたします。

  • TreeViewを反転表示したままTextBoxにカーソル

    VB2005 Expressで開発をしています。 TreeViewでノードを選択して、その値をTextBoxに表示しようと 思っています。 そこで、選択したノードを反転表示したままTextBoxにカーソル をセットすることは可能なのでしょうか。 フォーカスを当てた上体で反転されるので無理な気はするのですが、 ご存知の方がいらっしゃいましたら教えて下さい。 よろしくお願いします。

  • 画像クリックにて自分自身を別画像に入れ替えるには?

    ホームページを作成中なのですが、メニュー欄をそれぞれ画像にて表示し、画像クリックにて対象ページに飛ぶようにしております。 このたび、選択されたメニューを識別できるように、クリックされた画像を別画像に入れ替えて表示させようとしています。 onMouseOverやonMouseOut時に一時的に画像を入れ替えるロールオーバーのサンプルはよく見かけますが、できればロールオーバー的なものではなく、onClick時に自分自身の画像を入れ替えし、別の画像がクリックされるまで、ずっと入れ替えた画像を表示しておきたいのです。 JavaScript、CSSなど方法は問いません。 なお、テキストエディタにて作成しています。 どなたかよきアドバイスをお願いいたします。 よろしくお願いいたします。

    • ベストアンサー
    • HTML
  • 画像に触れると画像が変わるやつについて

    画像に触れると画像が変わるやつ (<IMG SRC="最初に表示される画像"   onMouseOver="this.src='触れると表示される画像'"   onMouseOut="this.src='最初に表示される画像と同じの'"> )の、 画像の大きさをWIDTH,HEIGHTなどで 指定することは出来ないのでしょうか?

    • ベストアンサー
    • CSS
  • Java Script、GGI、Flash?どれがいい?

    プログラマーじゃないので、あまり詳しくありません ホームページ上でテキストのランダム表示を行いたいです。 今、何でつくるか、考えているんですが、 何でつくるのがベストでしょうか? Java Script、GGI、Flashなどあると思うんですが。 当方、Flash(Action Scriptも)は使い慣れているんですが、 なんか重たくならないのか、多少心配です。

  • HTMLのonMouseにて画像の透明部分でカーソルが反応しないようにしたい

    HTMLでS字のようなイビツな形をした画像ボタンを作ろうとしています。ためしにGIF画像として作り、 onMouseout onMouseover の2つを用いて2種類の別々の画像をとっかえひっかえに表示するページを作りました。 しかし、S字画像ボタンの透明に設定した部分でもカーソルが反応してしまうので、何とかS字画像の色のついた部分のみでカーソルが反応するようにしたいです。 どのようにすれば理想通りの結果が得られるようになるのか、どうかお教え下さい。よろしくお願いいたします。

  • 画像をボタンのようにフォーカス対象にする。

    画像をボタンのようにフォーカス対象にする。 現在、画像にonclick,onmouseover,onmouseoutイベントを設け、 ボタンとして機能を持たせて、html画面を作成しております。 htmlソース <IMG id="logout_btn" onmouseover="Onmouseoverlogout();"  onmouseout="Onmouseoutlogout();"  onclick="clicklogout();"  img src="images/logout.gif"  width="100" height="27" border="0" name="logout_btn"> これを、キーボード操作だけでも押せるようにしたいのです。 この目的を果たす為には、 1.Tabキーが押された時に移り変わるフォーカス対象の中に加える (画面の中には他に幾つかのテキストボックスやコンボボックスがあります) 2.Enterキーが押された時のイベントを設定する。 この2項目を実現する為にはどうすればよいのでしょう? 特に2は、Enterキーを押した時にフォーカス状態にある対象を判別する ⇒それによって実行する関数を選ぶif分岐を作る、といった手順が必要かなと想像しています。 (フォーカスされている画像が、「ログイン」ボタンだったらSubmit関数を呼び、  「リセット」ボタンだったら全項目をブランクにするコードを走らせる、等…) フォーカス対象、などのキーワードで検索しても別の事例が検索できてしまい なかなか解決できません。 Web製作1ヶ月の初心者で、基本的な事を聞いてしまっているかもしれませんが ご助力いただけましたら幸いです。

  • onmouseoverとoutで画像を切り替えられた・・・けど、何だろう青い枠線;

    お世話になります。 ビルダー11で作成中です。 onmouseover時とonmouseout時に画像を入れ替える処理を入れました。 参考サイトさんを利用して、以下のようなソースです。 <img src="画像.jpg" alt="がぞう" onmouseover="this .src=画像2.jpg';" onmouseout="this .src='画像.jpg';"> でも、上記ソースだと、プレビュー画面で画像の回りに青い枠線が 常時表示されるようになってしまいました(!) ビルダー内蔵のJavaScriptで_HpbImgSwap関数があって、 それを利用していたときはそんなことにはならなかったのですが・・・。 ちなみに、「じゃあ、そっち使えばいいじゃん」とおっしゃる意見も 出ると思うのですが、そちらを利用すると、なんかONMOUSEのときに、 画像が凹む?のです。 それはちょっと都合が悪い、ということで、上記ソースでできるならば、と思いました。 青い枠線を非表示にするには、どうしたらよいでしょうか? ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ よろしくご教示ください。<(_ _)>

    • ベストアンサー
    • HTML
  • 文を選択すると黒く反転…

    ワード2010で入力した文をドラッグして選択すると、黒く反転表示されます。 今までは薄い青色だったのに、ある時を境に黒になってしまいました。 何が原因なのか分かりません。 青に戻す方法はありませんか?

  • 画像をランダムに表示させマウスを重ねるとさらに切り替わる方法

    今HPを作成しているんですが、題名の方法が知りたいです。 JavaScriptを使って画像をランダムに表示させる方法ありますよね。 <script language="javascript"> <!-- //ランダムに画像を表示 img = new Array(); img[0] = "画像1"; img[1] = "画像2"; img[2] = "画像3"; n = Math.floor(Math.random()*img.length); document.write("<img src='"+img[n]+"' border='0'>"); //--> </SCRIPT> それとマウスを重ねると画像が変わる onmouseover="this.src='画像4'" onmouseout="this.src='画像5'" というタグありますよね。 2つのタグを組み合わせてランダムに表示された画像に マウスを重ねると画像がかわるということがやりたいのですが JavaScriptの知識があまりないためわかりません。 この方法は可能でしょうか? もしくは他の方法あるでしょうか? ランダムに表示される画像は3枚と仮定し、 それぞれ3枚の画像はマウスを重ねるごとに 違う画像を表示させたいと思っています。 解決法をわかるかたがいらっしゃったら よろしくお願い致します。

    • ベストアンサー
    • HTML