• ベストアンサー

ポインタをあてると下に説明が表示されるようにしたい

いつもお世話になっております。 私は先日、ホームページビルダー10で趣味サイトを作成したのですが、ちょっと質問があるのです。 私のサイトはイラストサイトで、数個展示しております。 黒い四角(■)をクリックすると、画像がそれぞれ表示されるようにしています。 でも、考えてみれば閲覧者様はクリックしなきゃ何のイラストか解からないわけですよね。 よく他のサイトさんで、同じように■をクリックして画像表示する…というのを見かけますが、その時は大抵■にポインタ(矢印)をあてると下に説明(イラストのキャラの名前など)が出てきます。 私もそのようにしたいのですが、どのようにしたら良いのでしょうか？ どなたか教えて下さい！ お願いします(>_<)。

noname#17199
noname#17199

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

  • ベストアンサー
  • lanif
  • ベストアンサー率62% (170/273)
回答No.8

お詫びと補足です。 ANo.6の方が言われているように私の回答は画像への代替テキストなので今回の質問にはあてはまりません。 (ANo.1の■が画像の箇所を私が勘違いして聞いた様です。) ビルダー10では、フォントスタイルの設定というものが、インライン要素にあたるようです。 ただ、書式-文字飾りの属性としてフォントスタイルの設定<SPAN>と属性画面にいけますが、残念ながらｔtitleに関する項目が無い様です。 その為ANo.5の方が書かれている様に直接ソースに追記する事になります。勘違いさせて申し訳ないです。 尚、視力に障害をもつ私どもはサイトを閲覧の際に「ページ読み上げソフト」を使用している場合があります。 その為、サイト自身を理解するのに不要なデザイン上の画像にまで代替テキストを記述する必要はありません。 ただし記述することを正式な書式と制定した協会からは矛盾するので文字を書かずに「alt=""」にする事で 多くの読み上げソフトでもその箇所をスキップする事が出来る様になりました。 もう少しサイトを観る方へのアクセスビリティなどを考えますと上記の内容も知って作成していただくと大変助かります。 ＞alt属性はimg要素には必須、書き忘れ厳禁の属性で、代替テキストを記述します。 他の方の回答にこうありますが、最後の”代替テキストを記述”を勘違いされて全てに文字を書いている方もいたのでせっかくなので書かせていただきました。

noname#17199
質問者

お礼

沢山のアドバイスありがとうございました！ 失礼ではありますが、こちらに御礼をまとめさせて頂きます。 皆さんの回答のお陰で無事解決致しました！ 私自身素人なものですから、皆さんのアドバイスを頂けてとても勉強になりました(*^^)v 本当にありがとうございました！

その他の回答 (7)

  • giko001
  • ベストアンサー率31% (5/16)
回答No.7

私は<img src="URL" border=0 alt="説明">　としています。

回答No.6

回答にはなりませんが、alt属性を記述すれば大丈夫、なんて見当ハズレなことを言っている方もいますが、信用しないようにしてください。 alt属性はimg要素には必須、書き忘れ厳禁の属性で、代替テキストを記述します。 イラストの補足にalt属性を使っている、困った人をよく見かけますが、イラストが表示されない、表示したくない方のために、alt属性にはイラストを見なくても、何のイラストか分かるようなテキストを書いてください。 ■にマウスカーソルを乗せると、ポップアップを表示するようにしたいのであれば、No.5の方のいうとおり、インライン要素にtitle属性を記述すればいいです。 画像にポップアップを表示させたいときにも、img要素にtitle属性を記述すればいいです。 title属性のホームページビルダーでの記述方法は分かりませんので、調べるか、他の方が回答してくれるの待つなりしてください。 もし、■にマウスカーソルを乗せると、ポップアップではなくて、ステータスバーにテキストを表示させたいという意味の質問なら、javascriptを使えば可能です。 こちらも、ホームページビルダーではどのようにやればできるのかは分からないので、調べるなり、他の方の回答を待つなりしてください。

  • SortaNerd
  • ベストアンサー率43% (1185/2748)
回答No.5

文字でしたら <span title="表示させたい文字列">■</span> 画像ならaltも使えますね。

  • BLUEPIXY
  • ベストアンサー率50% (3003/5914)
回答No.4

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=SHIFT_JIS"> <title>Sample</title> <script type="text/javascript"> <!-- function show(id){ document.getElementById(id).style.display="block"; } function hide(id){ document.getElementById(id).style.display="none"; } //--> </script> </head> <body> <a href="Bel.jpg" onmouseover="show('Bel')" onmouseout="hide('Bel')">■</a><br /> <div id="Bel" style="display:none">　　ベルダンディ</div> <a href="Uld.jpg" onmouseover="show('Uld')" onmouseout="hide('Uld')">■</a><br /> <div id="Uld" style="display:none">　　ウルド</div> <a href="Scd.jpg" onmouseover="show('Scd')" onmouseout="hide('Scd')">■</a><br /> <div id="Scd" style="display:none">　　ウルド</div> </body> </html>

  • lanif
  • ベストアンサー率62% (170/273)
回答No.3

ホームページビルダー10で御使用ですのでそちらでの代替テキストの指示の方法をご案内致します。 HTMLソースから直接書き込む場合は該当のIMGタグ中に alt="表示したいテキスト"を半角スペースを空けて追加してみて下さい。 またページ編集モードなどで指定する場合は、画像を選び-右クリック-属性の変更または、「Altキー+Enterキー」のショートカットで同様に属性の変更画面に移れます(上段のメニューでも殆んど同様）。 属性画面の「代替テキスト」の箇所に表示したいテキストを記入します。これで表示可能になると思います。(ブラウザによって表示は若干違いあり) また作品を紹介となると大量に画像に上記の代替テキストを追加する際には、「ツール」-アクセシビリティチェックを利用すると代替テキストが無い箇所を探すのに便利です。 ※アクセシビリティではサイトを利用する人の利便性を考えて代替テキストなどを画像につけることを推奨していますが、強制では無いので無理に全てにつけなくても表示に特別な問題にはなりません。 それでは貴方の質問への回答が閉じられることを祈りつつ…頑張って下さいね。ビルダーのヘルプで代替テキストの説明は御覧になれるはずです。

  • akira18
  • ベストアンサー率0% (0/2)
回答No.2

己の無知を暴く覚悟で回答します(笑) タグ(HTML)の　<body></body>　の中に、 <img src="xxxxx" title="xxxxx">　と書けば、 あなたの望んでいる形になると思います。 kousyuさんのお役に立てられるか正直わかりませんが、 まあ気休めにでも試してみてください。

  • Jodie0625
  • ベストアンサー率30% (397/1288)
回答No.1

サムネイル表示のページにするというのもありますが、数が多かったら大変ですね。 ■が画像であれば、代替テキストを指定することで可能ですが、文字では不可です。 <img>タグのaltキーワードです。

  1. カテゴリ
  2. パソコン・スマートフォン
  3. ソフトウェア
  4. ホームページ作成ソフト

関連するQ&A

  • 自分のホームページ上でポインターの矢印の絵を変えたい

    過去ログを検索したのですが、いまいち求めているものが見つけられなかったので質問させて下さい。 現在、商用のホームページを作っています。 私のホームページを開けたときにポインターを矢印ではなく、自作のポインターが表示されるようにしたいのですが、どうすればいいですか？ 矢印のポインターの横に絵がついてくるようなものではなく、ポインター自身のイラストをを変えたいです。 参考になるHPや過去ログなどでもかまいません。 教えて下さい。宜しくお願いします。 ちなみにこれってビルダー6でも出来ますか？ 参考までに…（練習用でつかってます）。 ゆくゆくはDWでHP作成したいと思っているのですが。

  • 指差しポインターの文字について

    ホームページビルダー９を使用しています。 矢印ポインターから指差しポインターに変って、噴出しの中に文字が表示されますが、この表示の指示をビルダーのどこでするかと、噴出しの名称を教えてください。 以上、ご指導の程よろしくお願い致します。

  • 簡単な説明表示

    よくアイコン（画像）などにカーソルを置き しばらくするとちょっとした説明が表示される物が ありますよね。画像の場合だと <IMG src="画像のURL" url="説明">でしたっけ？ それを文字に置き換えてやりたいのです。 文字のところに触れると出るようにしたいのです。 例で言えば・・・ イラストサイトで「ひまわりと少年」という所に カーソルを置くと「男の子描きました」と出る。 で、その「ひまわりと少年」の部分をクリックすると そのイラストのページにいける・・・と。 こんな感じにしたいのですが出来ますか？ 説明下手ですいません。ビルダーで製作しているので タグのことはまだまだ初心者ランクです（泣） それともう１つ。この説明の文は改行することは 可能でしょうか？宜しく御願いします。

    • ベストアンサー
    • HTML
  • ホームページ作成　マウスポインタがキラキラ動くホームページにするには？

    いま、会社でホームページを作成しています。 マウスポインタを動かすとキラキラと星ポインタの後を動きながら付いてくるようにホームページを作りたいのですがどのようにしたらいいでしょうか？ 私も一度どのようなサイトを見たことあるのですが今は閉鎖されていて 閲覧することが出来ない為参考になるＵＲＬがありません（ーー； （このサイトはマウスポインタに動きがないので少し違うのですが 　http://www.tarako.com/　のような感じ。たらこが星になっていてキラキラ動いて付いて来るようにしたいのです） ちなみに使っているソフトはホームページビルダー１１ フラッシュソフトはFreeMotion 画像編集ソフトもあります！ よろしくお願い致します

  • リンク先の説明の表示

    たまにホームページを見ていると、リンクのはってある文字や画像の上にくると、矢印が出て、リンクの簡単な説明が出るのを見かけます。 あれをやってみたいのですが、あれはなんという名前で、どうやればできるのでしょう？ ホームページビルダー6.5を使用しています。よろしくお願いします。

    • ベストアンサー
    • CSS
  • 画像にポインタをあててもテキストが表示されない。

    オークションサイトを写真表示で閲覧の際、写真画像にマウスポインタをあててもテキストが表示されません。Macの場合は表示されないのでしょうか？ MacOS8.5、IE4.5、IE5（どちらでも同じでした）　　を使用しています。

    • ベストアンサー
    • Mac
  • ◇パワーポイントスライドショーのポインタ常時表示の方法

    パワーポイントをスライドショーにした直後にポインタ(矢印カーソル)が常時表示されている状態にしておく方法がありますか？ スライドショー時の右クリックでポインタオプションの「矢印」を選択するとそのスライドショーの間はポインタが表示されていますが、Escで戻ると「自動」に戻って再設定されてしまいます。

  • マウスポインター(矢印)に付きまとって来るのってどうやるの？

    サイトを閲覧していると、たまに単語の文字等が マウスポインター(矢印)に付きまとって来る 仕組みになっているサイトが有ります、 あれは何と言うもので、どうすれば作れるのでしょうか？ 教えて下さい。

    • ベストアンサー
    • CSS
  • 小さいサムネイルが作りたい

    ホームページビルダー９でサムネイル作成をしています。絵がでるのはわかりやすくていいと思うのですが、イラストの数が多くなりかなり雑然としてきてしまった感があります。 他の方のサイトで見たすごく小さい黒い四角 （人によってはその小ささで絵も入ってました）でポインタ合わせると絵のタイトルがでるタイプのサムネイルを試してみたいと思ったので、よろしくお願いします。

  • リンクにポイントする時のマウスポインタの形

    ホームページ作成についての質問です。 リンクの設定をすると、マウスポインタの形が手の形に変わりますが、この設定をやめて他のマウスポインタ（矢印）と同じ形にするにはどうしたらよいのでしょうか。 隠しページに使用したいのですが。 使用ソフトは、ホームページビルダｖｅｒ．６です。できたら、ビルダでの使用方法を教えていただけると嬉しいです。もしくは、ビルダでできない場合は、他の方法でもかまいません。

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する