你好,我对jquery比较陌生,但我喜欢它,我想知道我是否可以在页面的右下角定位一个div ,这样即使在页面向下滚动时,它的位置仍然是固定的。此后,我需要通过div中的图像传递一个链接到页面中的特定锚点。它应该简短而简单。
发布于 2011-03-17 21:55:25
#divid{
position: fixed;
right: 0;
bottom: 0;
}
发布于 2011-03-17 22:00:30
如果您可以接受position:fixed
在IE6中不受支持,并且IE7有一些注意事项,那么就根本不要使用jQuery:
<style type="text/css">
#myFixedDiv {
position: fixed;
bottom: 0;
right: 0;
...
}
</style>
<div id="myFixedDiv">
<a href="#myTargetDiv"><img src="img.gif" /></a>
</div>
<div id="myTargetDiv">
...
</div>
但是,如果IE6是一个问题,或者由于任何原因不能工作,您可以将一个事件绑定到窗口scroll
事件以帮助解决:
<script type="text/javascript">
var $myFixedDiv = $('#myFixedDiv');
var iFixedDivHeight = $myFixedDiv.outerHeight({ 'margin': true });
$(window).bind('scroll', function(e) {
var iWindowHeight = $(window).height();
var iScrollPosition = $(window).scrollTop(); // or document.body.scrollTop
$myFixedDiv.css({ 'top': iWindowHeight + iScrollPosition - iFixedDivHeight });
});
</script>
或者其他类似的东西。HTH。
发布于 2011-03-17 21:53:10
不需要jQuery
<div id="fixed-element" style="position:fixed; bottom:5px; right: 5px; z-index: 999">
<a href="#myAnchor"><img src="/src/to/image.jpg" /></a>
</div>
但如果是我,我会这么做:
(假设图像的宽度和高度为30 in,使用内联CSS,但我会将其保存在外部文件中)
<a href="#myAnchor" id="fixed-element" style="display:block; position:fixed; bottom:5px; right: 5px; z-index: 999; width: 30px; height: 30px; background:url(/src/to/image.jpg) no-repeat 0 0 transparent; text-indent: -9999">Click me</a>
https://stackoverflow.com/questions/5348557
复制