jQuery UI选项卡无法在触摸设备上运行(使用touchPunch)

时间:2015-05-21 03:25:00

标签: javascript jquery touch

我正在尝试在touchPunch旁边实现jQuery-UI标签,以便将点击映射到触摸事件。但是,触摸设备仍然无法识别触摸,因此标签不会切换。

这是我正在使用的脚本:

<script type="text/javascript"src="html/jquery-1.10.2.js"></script>
<script type="text/javascript" src="html/jquery-ui.js"></script>
<script type ="text/javascript" src="html/jquery.ui.touch-punch.js"></script>

<script language="JavaScript">
    $(function() {
        $( "#tabs" ).tabs({event:'click' ,hide:'fadeOut', show: 'fadeIn'}).addClass( "ui-tabs-vertical ui-helper-clearfix" );
        $( "#tabs li" ).removeClass( "ui-corner-top" ).addClass( "ui-corner-left" );

    });
</script>

我还尝试将事件更改为“touchstart”和“click touchstart”,它们都没有工作(第一个也禁用了点击)。

非常感谢任何帮助。谢谢!

编辑 - 这是使用的HTML代码

<div id="tabs" class="navtext" style="position: fixed; top: 73vh; left: 0.5vw; height: 25vh;">
    <ul style="list-style: none; font-size: 1.5vw">
        <li><a href="#Presets">Presets</a></li><br />
        <li><a href="#Channels">Channels</a></li>
    </ul>
    <div id="Presets">
        <div class="navtext" id="LayoutList"
             style="left: 9vw; height: 20vh;top: 1vh; width: 0; POSITION: absolute; background-color: transparent; overflow-y: scroll; -webkit-overflow-scrolling: touch">
        </div>
    </div>
    <div id="Channels">
        <div class="navtext" id="ChannelList"
             style=" width: 0; top: 1vh; POSITION: absolute; background-color: transparent; overflow-y: scroll; -webkit-overflow-scrolling: touch">
        </div>
    </div>
</div>

0 个答案:

没有答案