相关疑难解决方法(0)

我一直在看某些人的工作中的角色属性.我也用它,但我不确定它的效果.

例如:

<header id="header" role="banner">
    Header stuff in here
</header>

要么:

<section id="facebook" role="contentinfo">
    Facebook stuff in here
</section>

要么:

<section id="main" role="main">
     Main content stuff in here
</section>

这个角色属性是否必要？

这个属性对于语义更好吗？

它改善了SEO吗？

可以在这里找到角色列表,但我看到有些人自己组成.是允许还是正确使用角色属性？

有什么想法吗？

使用自举3的Javascript采取的核心例子为折叠的例子页面,我已经能够证明使用V形图标崩溃的状态.

我有这个工作使用:

$('#accordion .accordion-toggle').click(function (e) {
    var chevState = $(e.target).siblings("i.indicator").toggleClass('glyphicon-chevron-down glyphicon-chevron-up');
    $("i.indicator").not(chevState).removeClass("glyphicon-chevron-down").addClass("glyphicon-chevron-up");
});

这有效(并未在所有浏览器中进行过全面测试),但我想知道是否有更优雅的解决方案？

理想情况下我想使用核心功能,但我不确定如何用它来实现相同的结果.

$('#accordion').on('hidden.bs.collapse', function () {
    //do something...
})

这是jsfiddle中的一个工作版本.

这些"手风琴子菜单"适用于chrome和firefox,但不适用于iphone.

我建立了一个网站,在较小的屏幕上包含一个"offcanvas"导航菜单.用户点击"热狗按钮",导航菜单从左侧滑到屏幕上......到目前为止效果很好.

一些导航元素包含子菜单.对于那些,我使用了bootstrap的手风琴标记.用户单击箭头,"子菜单"将展开.

问题

我在linux上使用chrome开发.这种机制完全在Chrome,Firefox和每一个浏览器,我可以得到我的手,以及我个人的Android手机.它也适用于responsinator.com.但是,由于我没有Safari,也没有iPhone,因此我无法直接在iphone上测试此功能.我正在努力获得iPhone模拟器......

在那之前,其他一些人在iPhone上看过这个,我被告知"子菜单"根本不起作用.当用户点击箭头时,没有任何反应......

以下是包含"子菜单"的"菜单项"的摘录:请注意我使用的是"数据切换"和"数据目标"属性:

<div class="panel panel-default">
    <!-- The "Trigger" -->
    <div class="panel-heading">
        <h4 class="panel-title">
            <a href="view.php?cms_nav_id=1" name="about">
                About</a>
            <a data-toggle="collapse" data-target="#collapse1">
                <i class="pull-right icon-chevron-right mobile-nav-icon"></i>
            </a>
        </h4>
    </div>

    <!-- Populated submenus: -->
    <div id="collapse1" class="panel-collapse collapse">
        <div class="panel-body">
            <a href="view.php?cms_nav_id=7" name="ohioimprovementprocess">Ohio Improvement Process</a>
        </div>
        <div class="panel-body">
            <a href="view.php?cms_nav_id=8" name="org/orgbeliefs">Organization Beliefs</a>  
        </div>
    </div>

</div><!-- /.panel -->

我真的不知道接下来会尝试什么:类似的问题已经以"css冲突"或iphone问题结束.click(),但我没有使用它:我正在使用data-toggle/data-target.我正在考虑放弃'数据目标'标记,转而支持手动调用on('click', ... )事件,但我宁愿不...

顺便说一句,如果相关,我会在页面底部调用它:

<script src="/assets/dist/js/bootstrap.min.js"></script>

这是'bootstrap.js v3.0.0'.

有没有人有任何其他线索？最近有这样一个问题的直接经验吗？

在此先感谢您的帮助.

我正在尝试创建一个移动网站,我希望折叠框可点击而不仅仅是文本.

我已上传该网站. http://kristian-jacobs.dk/mobileapp/

提前致谢.

我正在使用twitter bootstrap的面板组件.我有以下代码

<div class="panel panel-info">
            <div class="panel-heading">
                <div class="row">
                    <div class="col-xs-6">
                        <i class="fa fa-comments fa-5x"></i>
                    </div>
                    <div class="col-xs-6 text-right">
                        <p class="announcement-text">My queue</p>
                    </div>
                </div>
            </div>
        </div>

如何使整个面板成为超链接.就像我应该能够点击面板的任何部分,它应该导航到另一个页面.

在线示例显示将页脚作为超链接,但我认为如果我可以使整个面板成为超链接会更好.

我不想使用metro.js.

谢谢.