注意,如果将类
我使用photobox在一个漂亮的画廊风格的div内显示所有图像。但是,我想在div中包含一个图像,我不想在画廊中,一个PDF图标,点击将下载PDF文件。此刻,这个图标出现在画廊点击时,我想知道如何排除也许div的一部分。
我的代码
<div id="gallery">
<td width="226" align="right"><table width="206" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="199" align="center"><a href="images/GrndFloor_dimension.jpg" target="_blank"><img src="images/GrndFloor_dimension_th.jpg" alt="Ground Floor" width="182" height="182" border="0"/></a></td>
</tr>
<tr>
<td height="64" align="center" background="images/thumbs-text-holder.jpg" class="planscopy" style="background-repeat:no-repeat"><table width="151" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="104"><span class="planscopy" style="background-repeat:no-repeat">Ground Floor - Dimensions</span></td>
<td width="47" align="right"><a href="docs/Ground Floor Plan - Dimensions.pdf" target="_blank"><img src="images/pdf.png" width="48" height="51"/></a></td>
</tr>
</table></td>
</tr>
</table></td>
</div>
<script type="text/javascript">
$('#gallery').photobox('a', { thumbs: true }, imageLoaded);
function imageLoaded() {
console.log('image has been loaded...');
}
我想pdf.png图像不出现在画廊,只是作为一个链接到文档。是否有办法排除div内的div id ?
尝试给a元素(PDF)一个类似"exclude"的类,并尝试这个JS-Code:
<td width="47" align="right"><a class="exclude" href="docs/Ground Floor Plan - Dimensions.pdf" target="_blank"><img src="images/pdf.png" width="48" height="51"/></a></td>
<script type="text/javascript">
$('#gallery').photobox('a:not(.exclude)', { thumbs: true }, imageLoaded);
function imageLoaded() {
console.log('image has been loaded...');
}
</script>
$("#gallery").photobox("a:not(:has([src$='pdf.png']))', { thumbs: true }, imageLoaded);
。(选择器的演示:http://jsfiddle.net/pUkz2/)
注意,如果将类
pdf
添加到a
并使用
,则上述选择器的速度要慢一些。$("#gallery").photobox("a:not(.pdf)', { thumbs: true }, imageLoaded);
我做了一个性能测试:http://jsperf.com/pukz2