Angularjs - 单击按钮时水平滚动

Posted

技术标签:

【中文标题】Angularjs - 单击按钮时水平滚动【英文标题】:Angularjs - Horizontal scroll upon button click 【发布时间】:2016-09-02 16:24:56 【问题描述】:

如何在点击时使用左右箭头进行水平滚动。

<div ng-controller="TabsDemoCtrl">
<button class="btn-sm btn-default glyphicon glyphicon-chevron-left" style="float: left; margin-top: 22px" ng-click="horizontalScroll()"></button>
  <uib-tabset active="active">
    <uib-tab index="0" heading="Static title">Static content</uib-tab>
    <uib-tab index="$index + 1" ng-repeat="tab in tabs" heading="tab.title" active="tab.active" disable="tab.disabled">
      tab.content
    </uib-tab>
  </uib-tabset>
<button class="btn-sm btn-default glyphicon glyphicon-chevron-right" style="float: right; margin-top: 22px;  right: 0px; position: absolute"  ng-click="horizontalScroll()"></button>
</div>

在这里,我使用示例教程创建了选项卡和按钮。附上link

请帮我解决这个问题。

【问题讨论】:

那么你想在单击右键时切换到下一个选项卡并在单击左键时切换到上一个选项卡吗? 不,当我点击右键时,标签应该向右移动,向左移动@ProllyGeek。抱歉耽搁了。 查看我在原版 javascript link 中所做的示例小提琴,就像我需要的那样。 对不起,你说的移动是什么意思?你只需要标签来滚动? 请查看链接here。我在 angular-bootstrap-ui 中需要同样的东西 【参考方案1】:

使用 &lt;scrollable-tabset&gt; 可以在 GitHub 上找到 https://github.com/VersifitTechnologies/angular-ui-tab-scroll

【讨论】:

以上是关于Angularjs - 单击按钮时水平滚动的主要内容,如果未能解决你的问题,请参考以下文章

Scrollview 内的 Scrollview 时水平滚动

表格溢出时水平滚动

滚动时水平集合视图冻结

带有 VFL 的 NSLayoutConstraint 仅在使用 '|' 时水平工作

在 iPad 上处于横向模式时水平翻转视图控制器

word 中水平滚动条与垂直滚动条怎样设置与取消??