jquery - Fluid CSS Grid structrue possible? -

-

Short and simple version: I have a project where I need to define divis that will repeat the horizontal and wrap it on the next line when the line outside the space (table-like grid) I've seen mention of jQuery.GridLayout, but the demo / Homepage is 404 so I do not have any clue if this is what I see. Just, I'm trying to get it: 

  Div.ItemClass Div.ItemClass Div.ItemClass Div.ItemClass Div.ItemClass Div.ItemClass Div.ItemClass Div.ItemClass ... < / Code>

The trick is to force me to use the same category (I have access to an optional item template, which will insert different codes for each optional item), But I need to 'stack' them horizontally until they move out of the horizontal position and then the next line 'Wrap' in Ti

Quick Background - The project is inside a CMS system, and item listing module gives me the following template files to work from inside

thanks 

 P > 
 Edit: OK, so I'm a fool and forgot Rule # 1 - Check your source (sung) The most important problem is that the CMS module, which contains the template object (headers, Item, optional, Footprint) is being done 'wrapping', which makes the true 'wrapping device' impossible. I'm glad I was not just going crazy because I had a fairly nested DIV right approach. Edit # 2: OK, now I'm thinking that I might close it. The bit of JQuery manipulation will require me to target Div.ItemClass and then place them in the wrapper division located Maybe, the exiting tabular layout code (probably can be used in the header template? As the current code is edited, when it is provided: 
 
  & lt; Td & gt; & lt;! - This header is html - & gt; & lt; div class = "Branches" Male "/>  gt; & lt; td & gt; & lt ;! - this item is html - & gt; & lt; div class =" ItemName "& gt; Item 1 & lt; ; / Div> gt; & lt; / td> & lt; td & gt; & lt ;! - This is optional - - & gt; & lt; div class = "item name" & gt; item 2 & lt; ; / Div> gt; & lt; / td & gt; & lt; td & gt; & lt ;! - this item is html - & gt; & lt; div class = "ItemName" & gt; Item 3 & lt; ; / Div> & lt; / td> & lt; td & gt; & lt ;! - This is Footer.html - & gt; [PAGER]   
 
 I hope this makes sense, as I have said before, lots of table CMS and module are compelled by the system; Industry do. 
 
 Edit # 3 - It was managed to work! Added a bit of jQuery: 
 
  $ (function () {$ ('div.ItemClass'). AppendTo ('#containererID');});  
 
 Just, it captures the divisive element with TD elements and puts them in container ID, which I have placed in the Header.html section!

If you have fixed the width then it is easy to just put float left on them and accordingly the width Organize so that only X items will be in one line. Something like this 

  & lt; Div class = "container" & gt; & Lt; Div class = "item" & gt; Larem ipsum & lt; / Div & gt; & Lt; Div class = "item" & gt; Larem ipsum & lt; / Div & gt; & Lt; Div class = "item" & gt; Larem ipsum & lt; / Div & gt; & Lt; Div class = "item" & gt; Larem ipsum & lt; / Div & gt; & Lt; Div class = "item" & gt; Larem ipsum & lt; / Div & gt; & Lt; Div class = "item" & gt; Larem ipsum & lt; / Div & gt; & Lt; Div style = "clear: both;" & Gt; & Lt; / Div & gt; & Lt ;! - To fix altitude only, remove to see effect - & gt; & Lt; / Div & gt;

More styles 

 . Container {width: 500px; } .item {width: 100px; // Float for 5 items (without margin): left; }

Comments

Post a Comment

Popular posts from this blog

c# - How to capture HTTP packet with SharpPcap -

-
I would like to capture all incoming HTTP packets on my machine. To do this, I am using SharpPcap which is a WinPcap The cover is. SharpPcap works very well, but it captures TCP packets and what it wants to do for me is a very low level. Does anyone know how can I easily get full HTTP requests / reactions from all these TCP packets? Thanks SharpPcap is already able to capture the packet in the same way That's what the virus does (just in the code instead of the GUI). And you can either either parse them directly or you can put them in the drive in the common .pcap file format. The steps to parse the capture are: Open a connection at any time Loop a while Or start capturing using an event callback Parsing the raw packet for the type you want If you are reading .PPP dump files In addition to calling you an offline capture reader is almost the same, there is no need to select an interface, and you can set the majority There is no need to do the modes. All st...
Read more

php - Multiple Select with Explode: only returns the word "Array" -

-
By using Wordpress I have created a multiple selection box so that users can select categories to exclude. When the page is initially loaded, I see my predefined default option. However, when I select a new value and I save ... I only see the word "Array" and have not chosen anything else? & lt; Class = "amultiple" id = "& lt; php echo $ value ['id'] ;? gt;" name = "& gt; php echo $ value ['id'] ;; gt; []" Multiple = "multiple" size = "8" & gt; & Lt ;? Php global option; Foreign currency ($ value as value $) {if (get_settings ($ value ['id']) === FALSE {$$ value ['id'] = $ value ['std']; } And {$$ value ['id'] = get_settings ($ value ['id']); }} $ Ranges = & amp; Amp; Categories ('type = post & orderbiz = name & amp; hide_empty = 1'); If ($ ranges) {$ ex_cat = implode (',', $ tt_cat_exclude); Forex Currency ($ range a...
Read more

php - jQuery AJAX Post not working -

-
I do not understand why this script does not work. It has something to do within AJAX PostScript / Function. Right now, when I submit my form, it runs php code on the same page. What it should do, send the values ​​of the form for Project_Azax.fp, then there will be a refund of success on the page which is correct or false. $ (document) .ready (function () {$ ('div # didIt'). Hide (); $ ('form [name = adminForm]'). Submit (function () ($ {'.post' ('/ project_ajax.php', {action: $ ('[name = action]') Val (), pId: $ ('[name = pId]'). Val (), name ('[Name = name]'. Val (), url: $ ('[url = url]'). Val (), summary: ('[summary = summary]'). Val ()}, Function (data) {if (data.success) {$ ('div # didIt') .Sliddown ('slow');} and {warning ('unsuccessful SA!');}}, 'Jason'); return false ;});}); What is the code for project_ajax.php below ... if ($ _ POST ['action'] == ...
Read more