Question

我想用.prependTo将表单元素从一个移动到div到一个页脚div但是我有点不确定如何去做。

正常状态是表单元素位于平板电脑和桌面媒体查询中名为headerRight的div中。对于480px及以下，我想将其移动到页脚div中的当前内容之前。

我有一个我在jsfidle中设置的示例代码。以下是代码段：

    $("#footer").prependTo("#want to move just the form in headerRight"));
else {
    $("#form").prependTo("#footer")) // or default state in headerRight

Answer 1

如果我理解正确，

$(function () {
  $(window).resize(ChangeDiv);
  $(window).trigger("resize"); // perform the logic onload  
});

function ChangeDiv() {
  var width = $(window).width();
  if (width <= 480) {
      $("#menu").after($("#header"));
      $("#footer").prependTo($("#headerRight form")); // prepend the form
  } else {
      $("#header").after($("#menu"));
      $("#headerRight").prependTo($("#footer form")); // put it back
  }
}

Updated Fiddle

使用.prependTo将表单移动到另一个div中

1 个答案: