通用 JavaScript 调整大小函数

发布于 2025-01-01 14:48:46 字数 456 浏览 1 评论 0原文

基本上这个函数是为了存储调用它的元素的高度值，然后如果该高度与该元素匹配，它将把它的高度扩展200px，如果它与存储的值不匹配，它会恢复该值（本质上是缩小元素）容器）。如何让它从外部样式表读取以获取 var heightVal = parseInt(boxStyle.height);？

function expand(e){
  var box = document.getElementById(e);
  var boxStyle = box.style;
  var heightVal = parseInt(boxStyle.height);

  if(boxStyle.height == heightVal){
    boxStyle.height = heightVal + 200 +'px';
  }
  else{
    boxStyle.height = heightVal;
  }

}

原文

Basically this function is meant to store the height value of the element that calls it and then if that height matches the element it will expand its height by 200px and if it does not match the stored value it restores that value (in essence shrinking the element container). How do I get it to read from the external style sheet to get the var heightVal = parseInt(boxStyle.height);?

function expand(e){
  var box = document.getElementById(e);
  var boxStyle = box.style;
  var heightVal = parseInt(boxStyle.height);

  if(boxStyle.height == heightVal){
    boxStyle.height = heightVal + 200 +'px';
  }
  else{
    boxStyle.height = heightVal;
  }

}

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

甜警司 2025-01-08 14:48:46

这是我修改后的答案...此代码允许普遍使用该函数来重新调整任何元素高度的大小，无论您是否希望它开始最小化或最大化和/或您是否希望它展开或折叠。我开发了这个函数作为对我之前写的答案的改进。这实际上是我一直致力于更改 CSS 类以允许在不使用 javascript 或 jquery 的情况下实现动画的另一个函数的结果。我现在两个功能都可以工作并且通用！

参数非常简单... box 表示要调整大小的元素，hNew 表示要调整其大小的高度（可以大于或小于元素的当前高度并且该功能仍然有效）。

function resize_height(box, hNew){
  if(box.style.height != hNew || box.style.height == box.old_height){
    box.old_height = box.style.height
    box.style.height = hNew;
  }
  else{
    box.style.height = box.old_height;
  }
}

This is my revised answer... This code allows for the function to be used universally to re-size any elements height regardless of whether you want it to start minimized or maximized and/or whether you want it to expand or collapse. I developed this function as an improvement on the answer I had previously written. This is actually a result of another function I have been working on to change the CSS class to allow for animation without using either javascript nor jquery. I now have both functions working and universal!

The parameters are pretty straight forward... box represents the element you want to resize, hNew represents the height you want to resize it to (can be larger or smaller than the current height of the element and the function still works).

function resize_height(box, hNew){
  if(box.style.height != hNew || box.style.height == box.old_height){
    box.old_height = box.style.height
    box.style.height = hNew;
  }
  else{
    box.style.height = box.old_height;
  }
}

回复收藏 0 原文

~没有更多了~