进度条引导-移动和桌面
进度条引导-移动和桌面
提问于 2017-01-08 18:27:34
我正在使用垂直进度条，它在桌面上运行良好，但我想在移动设备上改回水平，这也是通过删除div下的" progress - bar - vertical“类，只在移动设备上。
<div class="progress progress-bar-vertical">
<div class="progress-bar progress-bar-striped active" role="progressbar"
aria-valuenow="40" aria-valuemin="0" aria-valuemax="100" style="height:90%" data-toggle="tooltip" title="Center">
</div>
</div>但是我需要把桌面上的内联css "width:90%“改成移动端的"height:90%”。我该怎么做呢。
回答 2
Stack Overflow用户
发布于 2017-01-08 19:30:34
您可以将data-attribute添加到您的HTML中，并使用以下代码通过jQuery进行处理：
var resizeTimeout = false;
$(window).resize(function() {
if (resizeTimeout) clearTimeout(this.resizeTO);
resizeTimeout = setTimeout(function() {
//do something, window hasn't changed size in 500ms
// Get window size and process your html
if ($(window).width() < 480)
$('.screen').text('Mobile');
else
$('.screen').text('Desktop');
}, 200);
});
$(window).resize();和JSFiddle：https://jsfiddle.net/r3nkkjto/1/
Stack Overflow用户
发布于 2017-01-08 19:56:22
您只需在桌面上显示竖条/在其他设备上隐藏，在移动设备上显示/在其他设备上隐藏水平条即可。
对于桌面：
class = ".visible-md-* .visible-lg-*"对于移动端：
.visible-xs-* 对于平板电脑：
.visible-sm-*你需要为桌面设置整个div或navbar，然后用适当的类设置你想要在移动设备上可见的div或navbar。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/41531686
复制相关文章
相似问题
腾讯云开发者
