October 10th, 2012, 03:33 PM
|
|
Registered User
|
|
Join Date: Oct 2012
Posts: 2
Time spent in forums: 1 h 13 m 33 sec
Reputation Power: 0
|
|
|
Move Div when resize window
http://pastebin.com/qryPc77W
Original window size (desktop, laptop) it's like this:
left, menu, right.
When I resize to to below 481px I wan't the #middle first, so it ends up like this:
menu, left, right.
My Code:
Code:
jQuery(document).ready(function($) {
$(window).resize(function() {
var responsive_viewport = $(window).width();
if (responsive_viewport < 481) {
$('#inner-content').parent().prepend('<div id="main middle"></div>');
}
});
HTML:
<div id="inner-content" class="wrap clearfix">
<div id="main 1" style="background: #ccc;" class="fourcol first clearfix" role="main">
left
</div>
<div id="main middle" style="background: #ddd;" class="fourcol middle clearfix" role="main">
menu
</div>
<div id="main 3" style="background: #eee;" class="fourcol last clearfix" role="main">
right
</div>
</div>
|
Del.icio.us
Digg
Google
Spurl
Blink
Furl
Simpy
Y! MyWeb
Linear Mode
