主页 / 问题 / 809087
Accepted
Anton Essential
Asked:2020-04-04 03:04:40 +0800 CST2020-04-04 03:04:40 +0800 CST

如何确定jquery对象的位置和高度？

  • 772

下午好，请告诉我是否可以定义一个相对于 $(window) 对象的 div

比如我有一个父元素 $(window) 或者<body height='100%'>其他一些元素在里面，比如有一个300px的高度，这个元素后面跟着另一个元素，但是它可以有任意高度，所以问题是：是不是可以以某种方式确定此元素相对于 $(window) 对象的位置，考虑到顶部对象，如果它不适合 $(window) 可见区域，或者<body>将其设置为适合的高度，我考虑到上面可以有一个任意高度的元素，我不明白该怎么做。

<body> /* например body 500px(значение может быть любое оно должно реагировать на .on('load resize', function()) он же может быть и $(window) безразницы */
  <div class='object-1'></div> /* Этот объект напрмер 300px занчение может быть любое */
  <div class='adaptive height'></div> /* Этот объект должен принять такую высоту что бы не вылазить за пределы body или $(window) */
</body>
javascript

2 个回答

  1. Best Answer

    如果我正确理解了任务条件，请查看我的解决方案：

    var box = document.querySelector(".box");
var two = document.querySelector(".box__two");
var one = document.querySelector(".box__one");

two.style.height = (box.offsetHeight - one.offsetHeight) / 2 + "px";
two.style.width = (box.offsetWidth - one.offsetWidth) / 2 + "px";
    .box {
  width: 500px;
  height: 500px;
  border: 1px solid #000;
}

.box__one {
  width: 300px;
  height: 300px;
  background: #f00;
  margin: 5px auto;
}

.box__two {
  margin: 10px auto;
  background: #0f0;
}
    <div class="box">
  <div class="box__one"></div>
  <div class="box__two"></div>
</div>

    • 0

  2. 这样做了

    $(window).on('load resize', function(){
    var windowHeight = $(window).height(),
        containerTop = $('.module__info__content').offset(),
        containerHeight = $('.module__info__content');

    var newHeight = windowHeight - containerTop.top;

    containerHeight.height(newHeight - 120)
});
    • 0

相关问题