0

我正在使用 Lightbox2 显示表格中包含的缩略图中的照片幻灯片。我的页面正在做我想要的幻灯片和标题。但是,在单击缩略图开始幻灯片放映之前的初始页面中,如果我将鼠标悬停在表格中的缩略图照片上,则会打开一个小框(如工具提示框),显示表格的 HTML 代码、灯箱选项、照片等.我怎样才能抑制这个显示?

顺便说一句,在具有类似代码的 Milkbox 中不会发生这种情况。

最后,如果我删除 Lightbox 代码以便单击缩略图打开该缩略图的全尺寸图像,则不会发生此行为。

以下是我修改的一些示例代码,因为该页面存在于我们的 Intranet 上:

<table><tr>
<td id="mb1" align="center"><a id="mb1a" href="Photo1.jpg" data-lightbox="ga1" 
title="<table style='width:100%'><tr><td  style='width: 50%; border: 1px solid  #FFFFFF'<center>IGN Map</center></td><td style='width: 20'></td><td style='width:     50%; border: 1px solid #FFFFFF'><center>Carte IGN</center></span></td></tr>
<tr><td style='width: 50%; border: 1px solid #FFFFFF'>Right Click and choose 'Save Picture as...' to download this photo</td><td style='width: 20'></td>
<td style='width: 50%; border: 1px solid #FFFFFF'>Cliquer droit et choisir 'enregistrer l'image sous...' pour telecharger cette photo</td></tr></table>">
<img border="0" src="/thumbnail/Photo1.jpg" height="135" width="227" align="middle"/></a><br/>Map</td>

<td id="mb1" align="center"><a id="mb1a" href="Photo2.jpg" data-lightbox="ga1" 
title="<table style='width:100%'><tr><td  style='width: 50%; border: 1px solid #FFFFFF'><center>Google Earth</center></td><td style='width: 20'></td>
<td style='width: 50%; border: 1px solid #FFFFFF'><center>Google Earth</center></td></tr>
<tr><td style='width: 50%; border: 1px solid #FFFFFF'>Right Click and choose 'Save Picture as...' to download this photo</td><td style='width: 20'></td>
<td style='width: 50%; border: 1px solid #FFFFFF'>Cliquer droit et choisir 'enregistrer l'image sous...' pour telecharger cette photo</td></tr></table>">
<img border="0" src="/thumbnail/Photo2.jpg" height="96" width="227" align="middle"/></a><br/>Map2</td>

<td id="mb1" align="center"><a id="mb1a" href="Photo3.jpg" data-lightbox="ga1" 
title="<table style='width:100%'><tr><td  style='width: 50%; border: 1px solid #FFFFFF'><center>Profile</center></td><td style='width: 20'></td>
<td style='width: 50%; border: 1px solid #FFFFFF'><center>Profil</center></td></tr>
<tr><td style='width: 50%; border: 1px solid #FFFFFF'>Right Click and choose 'Save Picture as...' to download this photo</td><td style='width: 20'></td>
<td style='width: 50%; border: 1px solid #FFFFFF'>Cliquer droit et choisir 'enregistrer l'image sous...' pour telecharger cette photo</td></tr></table>">
<img border="0" src="/thumbnail/Photo3.jpg" height="164" width="227" align="middle"/></a><br/>Profile</td>
</tr></table>

javascript 和 CCS 文件是从网上下载的

4

1 回答 1

1

问题解决了。我的问题与此链接中的问题非常相似,在鼠标悬停时使用 javascript/jquery 隐藏标题属性

对该答案的轻微修改解决了我的问题

<script src="jquery.js"></script>
<script>
$(function(){

$('a').hover(function(e){

    $(this).attr('data-title', $(this).attr('title'));
    $(this).removeAttr('title');

},

function(e){

    $(this).attr('title', $(this).attr('data-title'));

});
$('a').click(function(e){
    $(this).attr('title',$(this).attr('data-title'));});

});

于 2013-11-09T18:20:28.163 回答