小编Edw*_*ard的帖子

Bootstrap:如何更早地折叠导航栏

我想以早于768px的分辨率折叠我的导航栏,例如992px,我该怎么做?谢谢!(我知道我可以在引导页面上自定义它,但我不想用新的bootstrap.css文件重新启动我的项目)

css collapse navbar twitter-bootstrap

45
推荐指数
3
解决办法
7万
查看次数

在浏览器调整大小(视口宽度)上动态添加类

我有一个名为 jobfilter 的元素,我想根据视口宽度向其中添加一个类,即。当我将浏览器的大小调整为 <1000px 时,我想将类 .hidden 添加到 .jobfilter。

现在,我在此链接的帮助下设法让它半途而废:$(window).width() 与 media query 不同。使用这个:

  function checkPosition() {
    if (window.matchMedia('(max-width: 767px)').matches) {
        //...
    } else {
        //...
    }
}
Run Code Online (Sandbox Code Playgroud)

这是我的 JSFiddle:http : //jsfiddle.net/ck55Lf01/10/

如果您调整浏览器大小并刷新页面,jobfilter 会隐藏,但我希望动态发生,而不是在页面刷新时,谢谢您的帮助!

javascript jquery

5
推荐指数
1
解决办法
2555
查看次数

将图像置于Bootstrap网格系统内

我想将我的图像集中在Bootstrap网格中,如下所示 - http://i.imgur.com/weTvp5Q.jpg ; 图像应位于蓝色框中(桌面和移动设备上).

这是我的HTML:

  <div class="row">        
   <div class="col-lg-4 col-md-6 col-sm-6 col-xs-12">
     <div class="image img-responsive">         
       <a href="#"><img class="img-responsive " src="http://i.imgur.com/GFZbJZr.jpg" border="0"></a>            
     </div>
    </div>      
   </div> 

   <div class="row">        
    <div class="col-lg-4 col-md-6 col-sm-6 col-xs-12">
     <div class="image img-responsive">         
       <a href="#"><img class="img-responsive " src="http://i.imgur.com/pJF2nvM.jpg" border="0"></a>            
     </div>
    </div>      
   </div> 

   <div class="row">        
    <div class="col-lg-4 col-md-6 col-sm-6 col-xs-12">
     <div class="image img-responsive">         
       <a href="#"><img class="img-responsive " src="http://i.imgur.com/JYYrpgD.jpg" border="0"></a>            
     </div>
    </div>      
   </div>
Run Code Online (Sandbox Code Playgroud)

html css image twitter-bootstrap twitter-bootstrap-3

0
推荐指数
1
解决办法
4137
查看次数