Javascript 更改引导下拉列表的方向

我怎样才能改变汽车的方向

我有这样一个下拉列表：

但我希望它看起来像这样：

---

使用

向右拉

或

向左拉

类。

Twitter引导中似乎没有选项来处理下拉菜单上的方向。所有对箭头位置有一定影响的是这个类

。navbar.nav>li>。下拉菜单：在

之前，尝试摆弄它来查看下拉方向上的变化

变换：rotateY

或

-webkit变换：rotateY

将起到作用，让我们将其应用于下拉菜单

navbar .pull-right > li > .dropdown-menu, .navbar .nav > li > .dropdown-menu.pull-right {
    -webkit-transform: rotateY(180deg);
}

或者，根据您的具体要求，您可以将其插入

.下拉菜单

或

.打开>.下拉菜单

类中。现在看来：

可以看出，所有链接都需要恢复，因此使用相同的CSS规则很简单：

.dropdown-menu > li > a {
    -webkit-transform: rotateY(180deg);
}

现在它看起来像：

需要通过改变下拉菜单的位置进行一些清理，方法是

left:10px，它看起来就像您想要的那样：

来自：

已弃用。向右对齐
从v3.1.0开始，我们已经弃用了
。在下拉菜单上向右拉。要右对齐菜单，请使用
。右下拉菜单。导航栏中右对齐的导航组件使用
此类的mixin版本可自动对齐菜单。到
覆盖它，使用
。下拉菜单左侧

在您的情况下，将
下拉菜单右键
类添加到具有
下拉菜单
类的div应该可以做到这一点。
在这里（使用下拉菜单右键）：





引导4

使用“右下拉菜单”和“左下拉菜单”




输出：


有关更多信息，请访问文档：
向右拉将强制整个下拉列表显示在屏幕的右侧parent@ParvSharma这正是他想要的他只想在另一边显示上箭头你想在右边显示实际的“下拉v”吗，但当你打开它时，打开列表的箭头会在左边？只需再添加一个类
.navbar.nav>li>。下拉菜单。下拉菜单修复：after、.navbar.nav>li>。下拉菜单。下拉菜单修复：before{left:auto；right:10px；}
。就这样，天哪。非常有创意，但是库已经通过菜单上的“pull xxx”类来支持它了。@Joshua我被告知库有“pull xxx”，因为我知道有一个名为Bootstrap的库。但请仔细阅读op的请求和我的答案，其中提供了翻转矩形上箭头的功能。您的解决方案仍然很古怪（但很有创意！）。最好覆盖下拉列表的CSS，调整箭头本身的位置。转换会产生更多的CPU负载，还可能引入bug。@Joshua操纵arrow本身的CSS会更简单，我同意，但我不认为我的解决方案比声称“pull-xxx”解决了op的问题更古怪：）
<ul class="dropdown-menu dropdown-menu-right">
   <li><a href"#">Action</a></li>
   <li><a href="#">Another action</a></li>
<ul>

<li class="nav-item dropdown">
        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
          @username
        </a>
        <div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdown">
          <a class="dropdown-item" href="#"><i class="fas fa-cog"></i> Account Settings</a>
          <a class="dropdown-item" href="#"><i class="fas fa-sign-out-alt"></i> Logut</a>
        </div>
      </li>