0

在 div 填充了未定义数量的文本之后，有什么方法可以将图像定位在 div 的底部（溢出 div 边缘）？

图像应该位于 div 内部的一半和 div 外部的一半 - 溢出边缘（如果你知道我的意思） - 我已经设法通过使用相对位置和静态布局（以像素为单位）来做到这一点）。但是，当 div 高度是动态的 (height=auto;) 时，这不起作用。

我有一个这样的html结构：

<div class="container">
    <div class="box">
        <p>X amount of text</p>
    </div>
    <img class="button" src="../images/image.png"></img>
</div>

我的 CSS：

.button
{
    position:relative;
    right: 30px;
    #bottom:-103px;
    #bottom: 70%;
    z-index:1;
}

此外，当单击图像时，框会展开。这是通过以下代码完成的（并且可以完美运行）：

var boxHeight = $('.box').height();
var boxHeightOffset = 5 - boxHeight;
$('.button').css('bottom', boxHeightOffset + "px");

我尝试过使用 bottom: % 但这显然什么也没做。我试图在视图加载时运行我的小 javascript 函数，但是我尝试实现它 - 我得到高度 = 0。

这个问题可能有点复杂，但我想知道是否有任何方法可以在正确的时间运行 javascript（在 div 加载时 - 不知何故）或编辑我的 css 使其更具动态性？

哦，我在 iOS 上使用 PhoneGap。（网络套件）

4

1 回答 1

2

怎么样：

#container {
  position:relative;
}         

.button { 
  position:absolute;
  bottom:-20px;
  right:-20px;
}

如果这不起作用，那么使用负的右边距和下边距如何？

于 2012-05-22T12:04:24.020 回答