Standard Layout application: Show/Hide Sidebar [with detailed annotations]_ experience Exchange
Source: Internet
Author: User
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 strict//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" > < HTML lang= "ZH-CN" xml:lang= "ZH-CN" xmlns= "http://www.w3.org/1999/xhtml" > <pead> <meta http-equiv= " Content-type "content=" text/html; charset=gb2312 "/> <title> Show/Hide </title> <style type=" Text/css "> <!--/* PR 50198763 */*{margin : 0;padding:0;} /* Eliminate the internal and external patch defaults for all tags */#left, #right {height:620px;} /* Define the height of the container */#left {background: #CCC;} /* Define the background color to distinguish the left and right containers */#right {background: #f5f5f5;} /* Ibid. left{float:left;width:20%;d isplay:block;}/* Defines the width of the left container */. right{float:left;width:80%;d Isplay:block;clear: Right;} /* Define the width of the right container */. left1{width:0%;d Isplay:none;}/* Defines the state when the left container collapses: hidden */-</style> </pead> <body> Explicit Show/Hide I am a JS beginner, caught dead. This JS demo is actually very simple, I just want to talk with JS Big say: JS is the behavior, do not fight with style sheet. Some things should still be done by CSS, for example: Display:none | | Display:block, it's overrun! I will only play CSS, get JS will not change, dare not change, alas. Clearly a class can be thrown to the CSS to do, JS why to Rob to do it? Make me these will point CSS drops rookie good is depressed ~ is playing CSS must be JS it? </body> </html>
[Ctrl + A full selection Note: If you need to introduce external JS need to refresh to execute]
The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion;
products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the
content of the page makes you feel confusing, please write us an email, we will handle the problem
within 5 days after receiving your email.
If you find any instances of plagiarism from the community, please send an email to:
info-contact@alibabacloud.com
and provide relevant evidence. A staff member will contact you within 5 working days.
A Free Trial That Lets You Build Big!
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
