Как вернуть insertAfter в jQuery?
Это мой код:
$(document).ready(function(){
function OrderDiv() {
if ($(window).width() <= 1024) {
$("#right1").insertAfter("#left1");
$("#right2").insertAfter("#left2");
$("#right3").insertAfter("#left3");
$("#right4").insertAfter("#left4");
} else {
// I DON'T KNOW WHAT TO WRITE HERE ^^
}
}
// check when page load
OrderDiv(); // NEW
$(window).resize(function(){
OrderDiv(); // check to destroy or build when we resize browser
});
});
Когда вы загружаете с размером экрана больше 1024px, без проблем, вы изменяете размер экрана ниже 1024px, порядок деления хорошо изменяется по мере необходимости.
Но когда вы загружаете под 1024px и изменяете размер до 1024px, я бы хотел отменить заказ и вернуться к основному.
Любая помощь будет очень ценится!
2 ответа
Вы можете использовать CSS, чтобы показать или скрыть свои элементы и вообще избежать JavaScript. Добавьте элементы в ваш HTML, а затем используйте следующий CSS:
#right1, #right2, #right3, #right4{
display: none;
}
@media screen and (min-width: 1024px){
#right1, #right2, #right3, #right4{
display: block;
}
}
Если вы действительно должны использовать jQuery для удаления и добавления элементов каждый раз, ваш оператор else будет просто:
} else {
$('#right1, #right2, #right3, #right4').remove();
}
if ($("#right1").length) { $("#right1").remove(); // go through all of them }
поместите это в свой текущий остальное. проверьте, существует ли этот элемент, если существует, удалите его, иначе ничего не делайте.