javascript - Find the width of a left floated list and apply to wrapper div to center it using css - jQuery? -

-

I want a ul center in a div with the left column of the liquid layout. To do this, I need to set the width of a div, which I used to wrap UL. Note: The list item (and content) is taken from the database using PHP.

I am interested in your suggestions that this is how to use jquery.

Consider the markup given below: 

  & lt; Div id = "wrapper" & gt; & Lt; Div id = "left-column" & gt; & Lt; Div id = "list-wrap" & gt; & Lt; Ul & gt; & Lt; Li & gt; Dynamic content 1 & lt; / Li & gt; & Lt; Li & gt; Dynamic content 2 & lt; / Li & gt; & Lt; Li & gt; Dynamic content 3 & lt; / Li & gt; & Lt; Li & gt; Dynamic content 4 & lt; / Li & gt; & Lt; / Ul & gt; & Lt; / Div & gt; & Lt ;! - / catalog-sheet - & gt; & Lt; / Div & gt; & Lt ;! - / left column - & gt; & Lt; Div id = "right-column" & gt; Content & lt; / Div & gt; & Lt ;! - / right-column - & gt; & Lt; Div style = "clear: both;" & Gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt ;! - / Cover - & gt;

Use of this CSS: 

  #wrapper {} # left column {float: left; Width: 50%; } # Right-column {float: true; Width: 50%; } #list-wrap {margin: 0 auto 0 auto; Padding: 40px; } #list-wrap_l {list-style-type: none; } #list-wrapped ul li (float: left: width 160px; height: 160px; margin: 20px;}

I'm not very clever when it comes to javascript, but I am thinking that the solution will be implemented as such:

  1. Find the width # Useable content area to be left-column.
  2. Determine how many Fit in width (# list-keeping, margin and padding in mind).
  3. Round around 200px (160p X width + 2x20px margin)?
  4. Apply width to # list-wrap.

Here's something I used to do before Some of the criteria to get started are: 

  var menuWidth = 0; $ (". Menu> ul> 
  •  A). (Function (i ) {MenuWidth + = $ (this) .Utwaid (true);}) $ ("menu") .css ("width", menuUttp;) Thanks in advance for your help,  
     Niels

    • Comments

    Post a Comment

    Popular posts from this blog

    oracle - The fastest way to check if some records in a database table? -

    -
    I have a big table to work with. I have to see that there are some records whose parent_id is equal to my passing value. Currently I do this by implementing "my_table using select count (*) where parent_id =: id"; If the result> 0, it means that they exist. Because this is a very large table, and I do not care what the actual number of records present, I just want to know if it exists, so I think count (*) Bit is disabled. How do I apply this requirement most quickly? I'm using Oracle 10. # Tips for Hibernation & amp; Tricks It suggests writing in such a way: Integer number = (integer) session .createQuery ("Select Count (*) to ...."). UniqueResult (); I do not know what is the magic of the unique rule? Why does it fast? To compare, select "1 from mytable where parent_id = passId and rowrum", which is more efficient? If you are not interested in the number of records, then there is an EXISTS query one: Select 'y'
    Read more

    php - multilevel menu with multilevel array -

    -
    Just ask someone to solve this problem? I want to create a multilevel menu I can not find the right solution generated with multilevel array, it always gets an array_push error My study came from the original idea But still my Can not match the need. This is my MySQL [code] ----- --------------------- --------------- | ID | PARENT_ID | Name | Link | Seq | 1 | 0 | Dashboad | Dashboard / | 1 | 2 | 0 | Menu 1 | Menu 1 / | 2 | 3 | 0 | Menu 2 | Menu 2 / | 3 | 4 | 0 | Menu 3 | Menu 3 / | 4 | 5 | 2 | Joint Add / | 1 | 6 | 3 | Joint Add / | 1 | 7 | 2 | Edit | Edit / | 2 | 8 | 4 | Joint Add / | 1 ------------------------------------------ [/ Code] I want to do something like this in my array array ('dashboard' = & gt; array ('id' = & gt; '' 'Dame' = & gt; 'Dashboard', 'Title' = & gt; 'Dashboard', 'MatchMin' = & gt; Base_URL (). 'Dashboard /', 'Active' => = & Gt; NULL), &
    Read more

    jQuery UI: Datepicker month format -

    -
    I am trying to change the format of the month that shows in the popup (not in the date that the picker actually I do not have any choice anywhere to do this, do I like to use a sub-string () or something else? What I normally display is Trying to change: Class = "ui-datepicker-title"> January & lt; / span & gt; ... & lt; / div & gt; Div>
    Read more