如何在按钮上激活Bootstrap背景按

我需要实现一种方法，当按下顶部导航菜单中的按钮时，激活引导模式背景/背景模糊。当用户点击飞机图标时，页面的主要内容区域需要变黑，然后在点击该按钮时恢复正常。如何在按钮上激活Bootstrap背景按

下面是展示什么，我想实现的图像： http://s17.postimg.org/glt8khwlb/stackoverflow.jpg

我对飞机的图标，下面的区号是：

<li id="ts-travel" ng-show="permissions.canViewDemonstrationMode"> 
     <a ng-click="searchTabToggle('travel')"> 
      <i class="ticon ti-airplane_take_off ti-2x"></i> 
     </a> 
    </li> 
</ul> 
<div class="tab-content bord-srch tab-pad overflow-hidden"> 
    <div class="tab-pane active cont fade in" id="products"> 
      <div class="form-group"> 
       <div class="col-sm-12"> 
       </div> 
      </div> 
     </div> 
     <div class="tab-pane cont fade in" id="travel"> 
      <div class="clear"></div> 
       <div ng-include src="'/views/Travel/Search/travel-search.html'" autoscroll=""> 
       </div> 
      </div> 
     </div> 
    </div>

这将需要激活时：

<a ng-click="searchTabToggle('travel')"> 
    <i class="ticon ti-airplane_take_off ti-2x"></i> 
</a>

被按下。

我们使用Angular JS作为这个系统

非常感谢！

来源

2014-10-27 Adam S

使用角，或jQuery，但[不是两个]（http://stackoverflow.com/questions/14994391/how-do-i-think-in-angularjs-if-i-have-a-jquery-background）。 – Jonast92 2014-10-27 21:57:44

这会解决问题了吗？

幕添加到您的模板，而是隐藏除非buttonIsPressed变量设置为true：

<div class="modal-backdrop fade" style="z-index: 1040" ng-show="buttonIsPressed"></div>

添加行为，以您的按钮，以便点击时buttonIsPressed变量被更新：

<a ng-click="searchTabToggle('travel')" ng-mousedown="buttonIsPressed = true" ng-mouseup="buttonIsPressed = false"> 
    <i class="ticon ti-airplane_take_off ti-2x"></i> 
</a>

来源

2014-10-27 22:21:52 AlexHv

感谢您的回复。我可能只是把背景放在我的模板的错误部分，但没有什么不同，当我按链接不幸的时候， – 2014-10-27 22:46:38

是由同一个控制器统治的模板的一部分？ – AlexHv 2014-10-27 22:51:06

叶认为是。我问其中一个开发人员的帮助，他给了我这个： data-ng-class =“{'modal-backdrop'：showThinkSearch}” 我可以让它显示某种背景，但它不涵盖我想要的东西。 – 2014-10-28 03:40:20

如何在按钮上激活Bootstrap背景按

回答

相关问题