2

当父容器的计算高度由于动态内容而超过 336 像素时,我想显示一个绝对定位的元素(“阅读更多”链接)。阅读更多链接的祖父容器具有 336px 的设置高度和隐藏的溢出。我有一个类我想添加到阅读更多链接中,它将把它从 display: none 更改为 display: block。我是 JS 的新手,所以我会很感激任何帮助。

http://jsfiddle.net/sueanna/FHhMG/

<style>

body {font-family: arial; font-size: 16px;}

p {line-height: 24px; margin:0 0 24px;}

span {display: none; background: #fff;  bottom: 0; line-height: 24px; position: absolute; width: 100%;}

.foo {display: block;}

.frame {height: 336px; overflow: hidden; position:relative;}

</style>

<div class="frame">
<div class="content">
<p>
Wonder Woman is a fictional DC Comics superheroine 
created by American psychologist and writer William Moulton Marston. 
She first appeared in All Star Comics #8 (December–January 1941). 
The Wonder Woman title has been published by DC Comics almost continuously 
except for a brief hiatus in 1986.[1] Her depiction as a heroine 
fighting for justice, love, peace, and sexual equality has also 
led to Wonder Woman being widely considered a feminist icon.
</p>

<p>
During the Silver Age, under writer Robert Kanigher, Wonder Woman's
origin was revamped,[19] along with other characters'. 
The new origin story increased the character's Hellenic and mythological 
roots: receiving the blessing of each deity in her crib, Diana is 
destined to become "beautiful as Aphrodite, wise as Athena, as 
strong as Hercules, and as swift as Hermes."
</p>

<span>read more</span>
</div>
</div>

谢谢,

起诉

4

1 回答 1

0

给你 http://jsfiddle.net/FHhMG/1/

<script>
  function load(){
    if (document.getElementById("readMore").parentNode.offsetHeight > 336){
        alert("hi");
        //document.getElementById("readMore").className = "MyClass" 
    }
  }
</script>
<body onload="load()">
<div class="frame">
<div class="content">
<p>
Wonder Woman is a fictional DC Comics superheroine 
created by American psychologist and writer William Moulton Marston. 
She first appeared in All Star Comics #8 (December–January 1941). 
The Wonder Woman title has been published by DC Comics almost continuously 
except for a brief hiatus in 1986.[1] Her depiction as a heroine 
fighting for justice, love, peace, and sexual equality has also 
led to Wonder Woman being widely considered a feminist icon.
</p>

<p>
During the Silver Age, under writer Robert Kanigher, Wonder Woman's
 origin was revamped,[19] along with other characters'. 
 The new origin story increased the character's Hellenic and mythological 
 roots: receiving the blessing of each deity in her crib, Diana is 
 destined to become "beautiful as Aphrodite, wise as Athena, as 
 strong as Hercules, and as swift as Hermes."
</p>

<span id="readMore">read more</span>
</div>
</div>
</body>
于 2013-07-14T03:45:08.010 回答