Question

我在Rails导航栏上的红宝石有问题。我正在使用haml以及bootstrap gem。

这是我的application.html.haml

!!!
%html
%head
  %title GameX
  = stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true 
  = javascript_include_tag 'application', 'data-turbolinks-track' => true
  = csrf_meta_tags

%body
  %nav.navbar.navbar-inverse
    .container
        %ul.nav.navbar-nav.navbar-left
          .navbar-brand= link_to "GameX", root_path

      - if user_signed_in?
        %ul.nav.navbar-nav.navbar-left
          %li= link_to "New GameX", new_pic_path
          %li= link_to "Settings", edit_user_registration_path
          %li= link_to "Sign Out", destroy_user_session_path, method: :delete
      - else
        %ul.nav.navbar-nav.navbar-left
          %li= link_to "Sign Up", new_user_registration_path
          %li= link_to "Log In", new_user_session_path

  .container
    -flash.each do |name, msg|
      =content_tag :div, msg, class: "alert alert-info"

    =yield

我想添加一个响应式的汉堡菜单。因此，当浏览器变小时，汉堡菜单出现在导航栏品牌旁边，并且可以单击。我该如何实现？

我尝试过在线搜索有效的教程，但它们似乎都包含其他内容。

编辑：我已经摆脱了以下问题：当浏览器较小时，链接会停留在品牌旁边。

Answer 1

看看documentation for the navbar component。

您将需要在joml.nounsafe=true锚旁边添加类别为import java.nio.ByteBuffer; import java.nio.ByteOrder; import java.nio.FloatBuffer; import org.joml.Matrix4f; public class JomlMatrixToBuffer { public static void main(String[] args) { Matrix4f matrix4f = new Matrix4f().ortho(-2.0f, 2.0f, -1.5f, 1.5f, -1.0f, 1.0f); FloatBuffer matrixBuffer = createFloatBuffer(16); matrix4f.get(matrixBuffer); System.out.println("Result:"); for (int i = 0; i < matrixBuffer.capacity(); i++) { System.out.println(matrixBuffer.get(i)); } } private static void matrixToBuffer(Matrix4f m, FloatBuffer dest) { matrixToBuffer(m, 0, dest); } private static void matrixToBuffer(Matrix4f m, int offset, FloatBuffer dest) { dest.put(offset, m.m00()); dest.put(offset + 1, m.m01()); dest.put(offset + 2, m.m02()); dest.put(offset + 3, m.m03()); dest.put(offset + 4, m.m10()); dest.put(offset + 5, m.m11()); dest.put(offset + 6, m.m12()); dest.put(offset + 7, m.m13()); dest.put(offset + 8, m.m20()); dest.put(offset + 9, m.m21()); dest.put(offset + 10, m.m22()); dest.put(offset + 11, m.m23()); dest.put(offset + 12, m.m30()); dest.put(offset + 13, m.m31()); dest.put(offset + 14, m.m32()); dest.put(offset + 15, m.m33()); } private static FloatBuffer createFloatBuffer(int size) { return ByteBuffer.allocateDirect(size << 2) .order(ByteOrder.nativeOrder()) .asFloatBuffer(); } }的汉堡菜单按钮。

您还需要将链接添加到类别为Unsafe的div中，该类别由您的汉堡包菜单通过navbar-toggle collapsed属性触发。

Ruby on Rails haml导航栏汉堡包菜单

1 个答案: