-1

この質問を読みました:アンカー タグのタイトル属性内にイメージ タグを追加する方法は? 「不可能」という答えが1つしかありませんでした。しかし、私は彼らがこのページでそれを行うことができるのを見ました: http://truyen.vnsharing.net/Nhom/GoldenSun---yurivn-net

ページのソースを表示したところ、次のようになりました。

<a href="/Truyen/Citrus-Saburo-Uta?id=7048" title='
            <img width="120" height="165" src="http://truyen4.vnsharing.net/Uploads4/Etc/5-1-2013/12456468861citrus_ch01_02-03.jpg" style="float: left; padding-right: 10px" />
            <div style="float: left; width: 300px">
                <a class="bigChar" href="/Truyen/Citrus-Saburo-Uta">Citrus (Saburouta)</a>
                <p>
                    Nh&acirc;n vật ch&iacute;nh Yuzuko, ngay ng&agrave;y đầu ti&ecirc;n chuyển trường đ&atilde; đụng mặt v&agrave; kh&ocirc;ng mấy cảm t&igrave;nh với Mei - hội trưởng hội học sinh ở &nbsp;trường mới, trong ...
                </p>
            </div>'>
            Citrus (Saburouta)</a>

しかし、それらのhtmlコードを自分のWebサイトに配置すると、画像が表示されませんでした。では、どうすればそれができるのでしょうか? js スクリプトなどを使用していますか?

4

4 に答える 4

2

他の人が述べたように、「タイトル」属性内に HTML コンテンツを配置することはできません。カスタムでなければなりません。

純粋な CSS ソリューション (JavaScript とマウスオーバー イベントを含まない) の場合、リンクの横にツールチップ コンテンツを含む DIV を配置し、そのスタイルを「display: none」に設定し、アンカーに次のようなスタイルを設定できます。

a:hover + div {
   display: block !important
}

これにより、リンクに付随する DIV が選択されて表示されますが、リンクの上にカーソルを置いた場合のみです。上記のコードのようにすべてのリンクをターゲットにするのではなく、特定のリンクをターゲットにすることで、より細かくすることができます。

これがデモです：http://jsfiddle.net/4WZvL/

于 2013-09-17T17:22:03.070 に答える
2

リンク先の質問に対する受け入れられた回答を引用するには

IMG insdie DIV および mouseHover イベントでカスタム ツールチップのような効果を使用する必要があります。

カスタム ツールチップのような効果を使用します。

于 2013-09-17T16:48:18.863 に答える
1

その title 属性のイメージ タグはエンコードされます。これにより、アンカーのタイトル タグに必要な任意の文字列を配置できますが、それが良いアイデアであるとは限りません。論理的な方法でその URL を使用する方法を知っている限り、javascript を使用して、設定したデータ属性から適切な画像 URL を取得し、同じ効果を得ることができます。少なくともそうすれば、HTML 標準の意図を悪用して派手なトリックを実行するだけでなく、ある種の標準に従っていることになります。

ユハナがあなたの質問に答えました。しかし、概念を拡張するために、データ属性、ID、およびクラスを簡単に使用して、必要なものに対して非表示または参照される html 要素を設定できます。指定したリンクからの画像でそのブロックをポップアップすることが目的の効果である場合は、css で要素を非表示にしてから、javascript でそれらを再表示できます。

正確なニーズを指定し、それを自分で解決しようとしたことを示すと、誰かが例を提供するかもしれません.

于 2013-09-17T16:55:35.330 に答える