Thursday, April 25, 2024
 Popular · Latest · Hot · Upcoming
138
rated 0 times [  144] [ 6]  / answers: 1 / hits: 47674  / 16 Years ago, tue, february 17, 2009, 12:00:00

How would I go about reordering divs without altering the HTML source code?



example, I want divs to appear in order #div2, #div1, #div3, but in the HTML they are:



<div id=#div1></div>  
<div id=#div2></div>
<div id=#div3></div>


Thanks!


More From » jquery

 Answers
20

There is no catch-all way of reordering elements with css.



You can inverse their order horizontally by floating them all to the right. Or you can position them absolutely relative to the body or some other containing element - but that comes with severe limitations regarding the size of the elements, and positioning relative to other elements on the page.



Short answer: You can only achieve this in a very limited set of circumstances. Reordering elements is best done in markup.



If you have no control over the html, you could use javascript. Here using jQuery:



$(#div2).insertAfter(#div3);
$(#div1).prependTo(#div2);


I certainly don't recommend that unless your hands are tied. It will be harder to maintain, and for your end users it will make your page jerk around while its setting up the page.


[#99961] Tuesday, February 10, 2009, 16 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
emiliano

Total Points: 381
Total Questions: 109
Total Answers: 93

Location: Jersey
Member since Fri, Oct 1, 2021
3 Years ago
emiliano questions
;