Change layout / move elements on mediaquery change matchMedia() --- // Me quedé a mitad de hacer pruebas en este codepen: http://codepen.io/exhtml/pen/VaMyrV
/*
Me quedé a mitad de hacer pruebas en este codepen:
http://codepen.io/exhtml/pen/VaMyrV
*/
function cld_move_elem_on_mql(elem,wrapper) {
//con esto movemos LOS CONTENIDOS del elemento que pasamos
var getContent = $(elem).contents();
$(getContent).detach().appendTo(wrapper);
//con esto movemos TODO EL ELEMENTO
//$(elem).detach().appendTo(wrapper);
}
function cld_mediaquery_changed(mq) {
if (mq.matches) {
//$('.lorem').detach().appendTo('.box-one');
cld_move_elem_on_mql('.js-move-to-mobile-dropdown','.js-mobile-dropdown-wrapper');
} else {
//$('.lorem').detach().appendTo('.box-two')
//cld_move_elem_on_mq('.element','.target2');
//aqui habria que deshacer el movimiento no?
//podriamos almacenar de alguna forma dinamicamente el parent
}
}
if (matchMedia) {
var mq = window.matchMedia("(max-width: 480px)");
mq.addListener(cld_mediaquery_changed);
cld_mediaquery_changed(mq);
}