Question

查看我的fiddle，这是为了让navbar响应，这只是我一起入侵的原因，因为我无法想出更好的方法来制作品牌和导航文字 - 在中间对齐，并且它们的尺寸会相应变化。

我在文档就绪函数中低音化了，

function changeSize() {
    var navHeight = $("navmenu").outerHeight(true);
    var fromTop = $('this').scrollTop()+navHeight; 

    $("nav div a").css({"height" : navHeight + "px","line-height" : navHeight + "px"});

    if (fromTop > navHeight) {
        $("nav li").addClass("top-menu-collapsed");
    }
    else if (fromTop <= navHeight) {
        $("nav li").removeClass("top-menu-collapsed");
    }
}; 

changeSize();

然后有一个window.scroll里面的那个只在滚动时运行changeSize()。所以changeSize()正在加载，然后滚动。

但我不认为我做对了......？

如果有人能说得很轻松。请让我知道:)）

fyi，在jsfiddle预览窗口很小，我还没有为导航做col-sm，谢谢。

Answer 1

如果你想在结果上使用全宽度居中的导航栏＆lt; 800px然后使用媒体查询来做:)这是您编辑的媒体查询：

@media (max-width: 800px) {
  #options #big-list ul {
    list-style-type: none;
    columns: 3;
    -webkit-columns: 3;
    -moz-columns: 3;
    padding: 0; } 

    .myleisure a {
      width: 100%;
      text-align: center;
      padding-left: 0;
    }

    #thatnav li {
      width: 100%;
      text-align: center;
    }
}

这里是小提琴： https://jsfiddle.net/s2hg14Lq/

不确定如何定义一个函数并在javascript中调用它

1 个答案: