简体   繁体   English

CSS和HTML:如何在点击时创建展开式DIV?

[英]CSS and HTML: How to create an Expanding DIV On Click?

I need to create a DIV that has some content (some of which is hidden) and when you click on it, it expands and reveals the rest of its content.. 我需要创建一个包含一些内容的DIV(其中一些内容是隐藏的),当您单击它时,它会展开并显示其其余内容。

I have found many HOWTOs but use jQuery.... 我找到了很多HOWTO,但使用jQuery...。

I would like a solution using CSS and HTML (Javascript is good also!) 我想要一个使用CSS和HTML的解决方案(JavaScript也不错!)

Thanks in advance! 提前致谢!

<div id="sample"></div>

css CSS

#sample {
    border: 1px solid black;
    height: 15px;
    padding: 12px;
    overflow: hidden;    
}

javascript JavaScript的

document.getElementById("sample").onclick = function() {
    this.style.height = 'auto';
}

you can use some jquery for animated div 您可以使用一些jQuery的动画div

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM