Question

http://jsfiddle.net/10h8t3ah/

function changeHeight(rowNum) {
  document.getElementById("demo").style.height= "70px";
  var fooBar = document.getElementById(rowNum);
  fooBar.style.height = "100px";
}

我在这里要完成的是将一个定义为row1，row2，row3和row4的变量作为rowNum传递，它将使用相应的行＃更改链接和段落的高度。

我正在尝试传递段落和链接的ID，这样如果您将鼠标悬停在链接上，反之亦然，则高度会发生变化。

基本上，如果将鼠标悬停在链接或段落上，则相互并排的相应容器将在高度上展开，并且段落中的文本将可见。我用破解词的wrap-text属性设置的段落文本，但它似乎只是溢出了。

Answer 1

不是自己设计复杂的JavaScript函数，而是使用accordion来扩展内容。这是Bootstrap框架手风琴，专为此目的而设计。

链接到您可以了解详情的页面。

http://www.w3schools.com/bootstrap/bootstrap_collapse.asp

Answer 2

好的 - 有几个概念需要纠正才能理解为什么这不起作用：

DOM对象的id必须是唯一的 （您的jsfiddle在您的＆＃34;行和＃34上使用相同的ID; - 我＆＃39;已更新您的代码以使用class而不是ID，以便
您传递给changeHeight函数的参数必须是字符串（如果您传递row1，则row1必须是已定义的变量，而应传递{ {1}}＆＃39; - 再次，请参阅我更新的小提琴代码）

这是一个jsfiddle，可以完成您想要的大部分工作，我认为：http://jsfiddle.net/zwyr4hn1/10/

我还修了几件小事： 1.当一个新行被悬停时，你需要将其他行返回到较小的大小（我已经在所有行对象上使用了类'row1来执行此操作） 2.需要此css才能使row个对象按您希望的方式调整大小：a

我还没有解决你提到的包装文本问题，因为我没有在jsfiddle上看到它。

需要用javascript扩展多行，文本溢出

2 个答案:

这是一个jsfiddle，可以完成您想要的大部分工作，我认为：http://jsfiddle.net/zwyr4hn1/10/