对于手机,平板电脑和台式机,Bootstrap 3的.hidden-和.visible-在哪里?

Gon*_*ing 3 jquery twitter-bootstrap

我有一个特殊的要求,我的JQuery插件"知道"Bootstrap使用的大小(例如xs,sm,md,lg手机,平板电脑或桌面),所以我决定将类添加到我可以查询的body标签.

基于网络上的几个例子,我想出了这个JQuery for Bootstrap我调用了jstrap:

http://jsfiddle.net/TrueBlueAussie/52VtD/3767/

如果您调整输出窗格宽度,您将看到颜色根据引导程序大小更改.

// Detect current bootstrap "size" and set appropriate "Size-" class on body element to allow for jQuery access (and additional styling)
function jstrap()
{
    var sizes = ["lg", "md", "sm", "xs", "phone", "tablet", "desktop"];
    var $el = $('<div>'),
        $body = $('body');
    $body.append($el);
    for (var i = 0; i < 7; i++)
    {
        var size = sizes[i];
        if ($el.addClass('hidden-' + size).is(':hidden'))
        {
            // Decorate body with a size class
            $body.addClass("Size-" + size);
        }
        else
        {
            // Remove this size (if previously present) as not applicable
            $body.removeClass("Size-" + size);
        }
    };
    $el.remove();
}
// Call jstrap on DOM load and on window resize
$(function ()
{
    $(window).resize(function ()
    {
        jstrap();
    });
    jstrap();
});
Run Code Online (Sandbox Code Playgroud)

它设置Size-样式的body元素,基于当前引导的造型,但我发现.hidden电话,.hidden,平板电脑和.hidden桌面不会出现工作.据另一篇文章response.less和其他响应较少的文件从Bootstrap丢失,该功能包含在bootstrap 3中,但似乎总是有.hidden-desktop,.hidden-tablet和.hidden-phone set.

我错过了什么?

注意:这是格式化为.less,所以没有关于代码格式的抱怨:)

moo*_*e99 14

在BS3中你只需要.hidden-xs/sm/md/lg,手机/平板电脑/桌面只适用于BS2.x [顺便说一下你链接的问题].

  • .hidden-xs目标手机 (2认同)