jQuery保持Div在屏幕底部

>本指南说明了如何使用jQuery在屏幕的顶部或底部保持DIV，以解决标准CSS解决方案不足的情况。尽管CSS提供了基本定位，但JQuery即使在滚动过程中也提供了可保持DIV位置的强大解决方案。

> css and jQuery Solutions >

这是一种CSS方法，以及Internet Explorer兼容性的JQuery后备：

.bottom {
  position: fixed; /* Preferred method */
  position: absolute; /* IE fallback */
  right: 0;
  bottom: 0;
  padding: 0;
  margin: 0;
}

/* IE-specific fix */
.fixie {
  left: expression((-jsrp_related.offsetWidth + (document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body.clientWidth) + (ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft)) + 'px');
  top: expression((-jsrp_related.offsetHeight + (document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight) + (ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop)) + 'px');
}

相应的jQuery代码：

// Note:  A height property MUST be set for this to work correctly.
if ($.browser.msie) {
  div.css({ position: "absolute", width: jslide_width, right: 0, height: 100 });
  div.addClass('fixie');
} else {
  div.css({ position: "fixed", width: jslide_width, right: 0, height: 100 });
}

高级技术和常见问题

> jQuery插件还可以在滚动过程中保持侧边元件可见度。 让我们解决一些常见问题：

Q：如何在使用jQuery滚动时将DIV保持在屏幕底部？ 在CSS中使用>。 例如：

>替换为div的ID。position: fixed

$("#yourDiv").css("position", "fixed");
$("#yourDiv").css("bottom", "0");

问：如何使用jQuery？

组合#yourDiv和

：

>

Q：为什么不在滚动上更新？ 相对于最近的位置祖先，位置相对于位置。没有一个，它将使用文档主体和页面滚动。使用

进行屏幕固定定位。offset() height()

Q：如何使用jQuery获得与视口的底部位置？

var bottom = $("#yourDiv").offset().top + $("#yourDiv").height();

问：如何使用jQuery？ position: absolute; bottom: 0;使用>方法：

position: absolute该增强指南提供了更清晰的解释和改进的代码格式，以提高可读性。

以上是jQuery保持Div在屏幕底部的详细内容。更多信息请关注PHP中文网其他相关文章！