-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 代码放在我的网站上时,图像没有显示。那么他们怎么能这样做呢?他们是在使用一些 js 脚本还是类似的东西?

4

4 回答 4

2

引用您链接到的问题的公认答案

您需要使用带有 IMG insdie DIV 和 mouseHover 事件的自定义工具提示外观效果。

他们使用自定义工具提示外观效果。

于 2013-09-17T16:48:18.863 回答
2

正如其他人所提到的,您不能将 HTML 内容放在“title”属性中 - 它必须是自定义的。

对于纯 CSS 解决方案(不涉及 JavaScript 和鼠标悬停事件),您可以将带有工具提示内容的 DIV 放在您的链接旁边,将其样式设置为“显示:无”,并为您的锚定样式,如

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

这将选择 DIV 附加链接并使其可见,仅当您将鼠标悬停在链接上时。您可以通过定位特定链接而不是所有链接来使其更精细,如上面的代码。

这是演示:http: //jsfiddle.net/4WZvL/

于 2013-09-17T17:22:03.070 回答
1

该标题属性中的图像标签已编码。鉴于此,您可以在锚的标题标签中放置您想要的任何字符串,但这并不意味着这是一个好主意。只要您知道如何以合乎逻辑的方式使用该 url,您就可以使用 javascript 从您设置的任何数据属性中提取正确的图像 url 并达到相同的效果。至少这样你会遵循某种标准,而不仅仅是滥用 html 标准的意图来实现一些花哨的技巧。

朱哈娜回答了你的问题。但是为了扩展这个概念,您可以轻松地使用数据属性、id 和类来设置隐藏或以其他方式引用的 html 元素以满足您的任何需要。如果想要的效果是使用您提供的链接中的图像弹出该块,您可以使用 css 隐藏元素,然后使用 javascript 取消隐藏它们。

如果您指定您的确切需求并展示您自己尝试解决的问题,有人可能会提供一个示例。

于 2013-09-17T16:55:35.330 回答
0

该 HTML 无效,尽管有可能,但这并不意味着您应该这样做。某些浏览器可能无法正确显示图像。

请改用数千个 Javascript 工具提示插件之一。这是 jQuery 的负载:https ://www.google.co.uk/search?q=jquery+tooltip+plugin

于 2013-09-17T17:11:37.413 回答