html - CSS DIV Swap without fixed height? -

-

I'm curious if it is possible to get simple div swap using CSS, if there is no fixed height in the divi Looking for a pragmatic answer to the answer and come up with some concrete discussion on this matter.

In this view, a huge beer list is to be divided into four separate divs and one time to display only one of them. When clicking on the associated anchor, the displayed division will switch when hiding the other three, the first division should be displayed when the page is loaded. With this I have a little experience and success, but with only certain sizes, all the other devices behind it will be hidden in the form of the leading diva.

These special devices will include formatted tables and unordered lists, I'm not sure there will be any impact on it, but thought that it is worth mentioning only in the case. There can not be a fixed height of the division because the number of items in each will be different I have not coded it yet because I'm not sure that it is worth investing on time, but the HTML looks like this: 

  & lt; Div id = "secondaryNav" & gt; & Lt; Ul & gt; & Lt; Li & gt; Link div1 & lt; / Li & gt; & Lt; Li & gt; Link div2 & lt; / Li & gt; & Lt; Li & gt; Link div3 & lt; / Li & gt; & Lt; Li & gt; Link Div4 & lt; / Li & gt; & Lt; / Ul & gt; & Lt; / Div & gt; & Lt; Div id = "swappedcontent" & gt; & Lt; Div id = "1" & gt; & Lt; Table & gt; & Lt; TR & gt; Content & lt; / TR & gt; X 40-50 & lt; / Table & gt; & Lt; / Div & gt; & Lt; Div id = "2" & gt; & Lt; Table & gt; & Lt; TR & gt; Content & lt; / TR & gt; X 40-50 & lt; / Table & gt; & Lt; / Div & gt; & Lt; Div id = "3" & gt; & Lt; Table & gt; & Lt; TR & gt; Content & lt; / TR & gt; X 40-50 & lt; / Table & gt; & Lt; / Div & gt; & Lt; Div id = "4" & gt; & Lt; Table & gt; & Lt; TR & gt; Content & lt; / TR & gt; X 40-50 & lt; / Table & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt ;! - swappedContent - & gt;   
 I have found an example that I am modeling after this layout (which uses javascript), but the reason for linking to this site is not guaranteed to me here If I have to link it to clarity, please let me know.   
 
 
 CSS "display" In each device:  
  & lt; Div id = "myDiv" style = "display: none;" & Gt;   
 And then when you want to display the div, javascript in the following:  
  document.getElementById ("myDiv"). Style.display = "block";   
 Finally, you will have something like this:  
  & lt; Div id = "secondaryNav" & gt; & Lt; A href = "javascript: void (0)" onclick = "showDiv ('1')" & gt; Link div1 & lt; / A & gt; & Lt; A href = "javascript: void (0)" onclick = "showDiv ('2')" & gt; Link div2 & lt; / A & gt; & Lt; A href = "javascript: void (0)" onclick = "showDiv ('3')" & gt; Link div3 & lt; / A & gt; & Lt; A href = "javascript: void (0)" onclick = "showDiv ('4')" & gt; Link Div4 & lt; / A & gt; & Lt; / Div & gt; & Lt; Div id = "swappedcontent" & gt; & Lt; Div id = "1" & gt; & Lt; Table & gt; & Lt; TR & gt; Content & lt; / TR & gt; X 40-50 & lt; / Table & gt; & Lt; / Div & gt; & Lt; Div id = "2" style = "display: none;" & Gt; & Lt; Table & gt; & Lt; TR & gt; Content & lt; / TR & gt; X 40-50 & lt; / Table & gt; & Lt; / Div & gt; & Lt; Div id = "3" style = "display: none;" & Gt; & Lt; Table & gt; & Lt; TR & gt; Content & lt; / TR & gt; X 40-50 & lt; / Table & gt; & Lt; / Div & gt; & Lt; Div id = "4" style = "display: none;" & Gt; & Lt; Table & gt; & Lt; TR & gt; Content & lt; / TR & gt; X 40-50 & lt; / Table & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; Script type = "text / javascript" & gt; Function show divi (divId) {for (i = 1; i & lt; = 4; i ++) {document.getElementById (i) .style.display = "none"; } Document.getElementById (divId) .style.display = "block"; } & Lt; / Script & gt;   
 Note: Make sure to place the script in an appropriate location (usually in the element).

Comments

Post a Comment

Popular posts from this blog

mysql - BLOB/TEXT column 'value' used in key specification without a key length -

-
I have developed an extension which works up to 1.6 on Magren (I'm trying Enterprise Edition, And I think the community is the same problem, because it is the same code). In my install script, I see the $ installer-> gt; CreateEntityTables ($ this- & gt; getTable ('alphanum / info')); The installation is done until it is not in the _text unit table. It crashed there! It turns out that when I log in to SQL and run it via PHPmyadmin, then this error is: Blob / Text column 'value' is used without the key 'key' . I saw the code there, and this is what is trying to create an index on the value column: -> addIndex ($ this- & gt; getIdxName ($ eavTableName, array ( 'attribute_id array (' attribute_id ',' value ')) - & gt; addIndex ($ this- & gt; getIdxName ($ eavTableName, array (' entity_type_id ' , 'Value')), array ('entity_type_id', 'value')) If there is no if statement is n...
Read more

c# - Using Vici cool Storage with monodroid -

-
Oh, for the moment I am not sure how it is officially supported, but for the success of the people Using Monodroid Vic Cool Storage I am able to leave and compile assemblies in my project, but while trying to use some classes, the errors of time have to be gathered. Especially when trying to connect like the example for Mono Touch string dbName = path. Cobain (environment. Gatefolder path (environment specialfolder personal), "mydb.db3"); // The following line will be called coolestation, where is the database, // to make it if it does not exist, and call a delegate that creates the necessary tables (only when the database file was newly created //) CSConfig.SetDB (DbName, true, () => {CSDatabase.ExecuteNonQuery ("Subscriber Integer Primary Key Attribute, Name Text (50) No, Number, Date First Text (30)");); There is no difference when I try to use the methods of CSConfig and when I cscfif If I try to pass 3 aggregates to STDB (3) then I get the invalid ...
Read more

python - referencing a variable in another function? -

-
I am an experienced TCL developer and write my own processes to help myself. I call it a proc i callVar, print out the value of the variable in a certain format, so I know that it is variable and what is the value "set foo 1; putVar foo" result 'foo = "1" I want to do the same thing in Python, but I can not find the answer :( In TCL I use the up command because when I pass the name of the variable, then I can see the value at the top. . I understand that an advanced light in the dragon There is no mechanism of r, but with its introspection capability, I would think that this is something trivial, but I am not getting the answer anywhere. It seems that this should work: and expanded: def foo (): y = "Hello World" printwor ("y") foo () y = "Hello World " You can, but you should not do so if your code is correct If is needed , then there is something wrong with your design, and you should probably use the dictionar...
Read more