2

有没有办法完成以下组件：

Div 用作过滤器列表的较小尺寸的“掩码”，并作为较大尺寸的女儿滚动。

我使用滚动 iscroll 和 iscrollview 被列入名单。但不要在相应的大小上提及。解释更好的 150px div 应该包含并且列表包含更大的高度。当关注过滤器列表时会出现问题，因为列表应该在没有这些属性的情况下滚动，而不是在带有滚动和过滤器的列表中：date-tap-toggle = "false" data-position = "fixed"。以下代码：

<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<meta name="viewport"
    content="width=device-width, initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"
    charset="UTF-8">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<link rel="stylesheet"
    href="style/jquery.mobile.structure-1.2.0.min.css" />
<link rel="stylesheet" href="style/jquery.mobile.iscrollview.css" /> 
<link rel="stylesheet" href="style/jquery.mobile.iscrollview-pull.css" /> 
</head>
<body>
<div data-role="page" id="index" data-theme="a">

        <div data-role="header" data-theme="a" data-position="fixed" data-tap-toggle="false"
            data-position="fixed" data-tap-toggle="false">
            <div data-role="navbar">
                <ul class="ui-grid-b">
                    <li class="ui-block-a"><a href="#"
                        data-href="center" id="btnCenter"
                        data-transition="none" data-theme="b">Center</a></li>
                    <li class="ui-block-b"><a href="#"
                        class="ui-btn-active" data-href="rast"
                        id="btnRast" data-transition="none" data-theme="b">Rast</a></li>
                    <li class="ui-block-c"><a href="#" data-href="help"
                        id="btnHelp" data-transition="none" data-theme="b">Help</a></li>
                </ul>
            </div>
        </div>

        <div class="content">


            <div id="listFilter" height: 150px
                style="width: 100%; margin-top: 10%; padding: 5px; margin-bottom: 5%;">

                        <ul id="listVeiculos" data-role="listview" data-theme="d"
                            data-filter-placeholder="Ve&iacute;culos" data-filter="true"
                            data-divider-theme="d" data-scroll="y">
                            <li data-role="list-divider">
                                <div class="ui-grid-c">

                                    <div class="ui-block-a">A</div>

                                    <div class="ui-block-b">B</div>

                                    <div class="ui-block-c">C</div>

                                    <div class="ui-block-d">D</div>
                                </div>
                            </li>

                            <li>
                                <div class="ui-grid-c">

                                    <div class="ui-block-a">001</div>

                                    <div class="ui-block-b">002</div>

                                    <div class="ui-block-c">003</div>

                                    <div class="ui-block-d">004</div>
                                </div>
                            </li>

                            <li>
                                <div class="ui-grid-c">

                                    <div class="ui-block-a">001</div>

                                    <div class="ui-block-b">002</div>

                                    <div class="ui-block-c">003</div>

                                    <div class="ui-block-d">004</div>
                                </div>
                            </li>
                        </ul>
            </div>

        </div>


        <div class="content_div" style="margin-top: 5%;" id="divListWithouScroll"   
            data-tap-toggle="false" data-position="fixed">

            <div>
                <ul data-role="listview" data-inset="true" id="listWithouScroll"
                    style="margin-top: 5%; border: 0px" data-theme="d"
                    data-dividertheme="d">
                    <li data-role="list-divider">1</li>
                    <li data-role="text">2</li>
                    <li data-role="text">3</li>
                    <li data-role="text">4</li>
                </ul>

            </div>
        </div>
    </div>

    <script src="js/cordova-2.2.0.js" type="text/javascript"></script>
    <script src="js/jquery-1.8.2.min.js" type="text/javascript"></script>
    <script src="js/jquery.mobile-1.2.0.min.js" type="text/javascript"></script>
    <script src="js/iscroll.js" type="text/javascript"></script>
    <script src="js/jquery.mobile.iscrollview.js" type="text/javascript"></script>
</body>
</html>

我使用了以下代码行，但它剥夺了所有屏幕都可以使用该功能，并且只有这个屏幕不应该：android:windowSoftInputMode="adjustNothing"。

谢谢！

4

0 回答 0