需要一些帮助来构建一个扩展的 div

发布于 2024-09-25 06:22:28 字数 147 浏览 3 评论 0原文

我需要一个扩展 div，它在初始化时仅显示 300x960 图像的顶部 30x960 以及左上角的“扩展”按钮。单击展开按钮将使 div 向下“滑动”以显示 300x960 的完整图像。单击其他任何位置，无论是展开还是收缩，都会将用户带到广告商网站。我可以从中构建任何快速片段吗？

原文

分享到QQ

分享到微博

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

发布评论

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

我三岁 2024-10-02 06:22:28

尝试这样的事情：

<div style="width:960px; height:30px; position:relative; overflow:hidden">
<a href="http://another/site/"><img src="image.jpg" alt="" /></a>
<input type="button" value="Expand" style="position:absolute; left:10px; top:10px" onclick="expand(this)" />
</div>

<script type="text/javascript">
function expand(btn)
{
    btn.style.display='none';
    slide(btn.parentNode,30);
}

function slide(div,curHeight)
{
    if(curHeight==300)return;
    curHeight+=10;
    div.style.height=curHeight+'px';
    setTimeout(function(){slide(div,curHeight);},25);
}
</script>

Try something like this:

<div style="width:960px; height:30px; position:relative; overflow:hidden">
<a href="http://another/site/"><img src="image.jpg" alt="" /></a>
<input type="button" value="Expand" style="position:absolute; left:10px; top:10px" onclick="expand(this)" />
</div>

<script type="text/javascript">
function expand(btn)
{
    btn.style.display='none';
    slide(btn.parentNode,30);
}

function slide(div,curHeight)
{
    if(curHeight==300)return;
    curHeight+=10;
    div.style.height=curHeight+'px';
    setTimeout(function(){slide(div,curHeight);},25);
}
</script>

回复收藏 0 原文

~没有更多了~