位置灯箱 - Fancybox
我需要将灯箱放置在图像的一部分上。我尝试添加这个 CSS:
#globe{
position:absolute;
left:170px;
top: 50px;
}
当我这样做时,它会破坏灯箱。如何定位灯箱? (我正在使用 Fancybox)这是我的 HTML:
<p><a id="fancy" href="#globe"><img class="center" style="width:620px;"
src="/messages4u/2011/images/october/baby-n-grandfather.jpg" /></a></p>
<p> </p>
<p> </p>
<div class="hide"><div id="globe">
<img src="/messages4u/2011/images/october/globe-text.png" width="400"
height="400" /></div></div>
<script type="text/javascript">
var $j = jQuery.noConflict();
$j(document).ready(function() {
$j("a#fancy").fancybox({
'padding' : 0,
'overlayShow' : false,
});
});
</script>
现在如何将图像放置在灯箱中我想要显示的位置?
I need to position my lightbox over a part of the image. I tried adding this CSS:
#globe{
position:absolute;
left:170px;
top: 50px;
}
When I do that it breaks the lightbox. How do I position the lightbox? (I am using Fancybox) here is my HTML:
<p><a id="fancy" href="#globe"><img class="center" style="width:620px;"
src="/messages4u/2011/images/october/baby-n-grandfather.jpg" /></a></p>
<p> </p>
<p> </p>
<div class="hide"><div id="globe">
<img src="/messages4u/2011/images/october/globe-text.png" width="400"
height="400" /></div></div>
<script type="text/javascript">
var $j = jQuery.noConflict();
$j(document).ready(function() {
$j("a#fancy").fancybox({
'padding' : 0,
'overlayShow' : false,
});
});
</script>
Now how do I position the image where I want it displayed in the lightbox?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
您需要定位 fancybox-outer
You need to target fancybox-outer