javascript - 如何使用 Javascript 为 iScroll.js 设置高度

Question

我是 JS 新手，我需要一些帮助，

我使用 iScroll.js 文件在 phonegap 应用程序中 ScrollView 。

我使用代码进行滚动。

在 HTML 中

<div id ="div_id" align="center" style="width:70%;margin-left: 15%;margin-right: 15%;">
    <table style="width:100%; height:15px;">
        <tr>
            <td>
                <img style="width:20px;height:20px;margin-top: 5px;float:right" src="img/arrowleft.png" onclick="datedecriment()" />
            </td>
            <td align="center">
                <h5>
                    <a id ="month">Month</a>
                    <a id="date">Date</a>
                    <a id="year">year</a>
                </h5>
            </td>
            <td>
                <img style="width:20px;height:20px;margin-top: 5px;float:right" src="img/arrowright.png" onclick="incriment()"/>
            </td>
        </tr>
    </table>
</div>

在 JS 文件中

<script type="text/javascript" src="js/iscroll.js"></script>
<script>
    document.addEventListener('DOMContentLoaded', function () { setTimeout(loaded, 200); }, false);
    //scrolling functionality//
    var myScroll1;
    function loaded1() {
        myScroll1 = new iScroll('div_id', {desktopCompatibility:true});
    }
</script>

但是，如何设置高度。你能帮帮我吗

Answer 1

试试这个

HTML

<div id ="div_id" align="center" style="width:70%;margin-left: 15%;margin-right: 15%;">
    <!-- Extra div as iscroll is placed on direct child element-->
    <div class="my_scroll">
        <table style="width:100%; height:15px;">
            <tr>
                <td>
                    <img style="width:20px;height:20px;margin-top: 5px;float:right" src="img/arrowleft.png" onclick="datedecriment()" />
                </td>
                <td align="center">
                    <h5>
                        <a id ="month">Month</a>
                        <a id="date">Date</a>
                        <a id="year">year</a>
                    </h5>
                </td>
                <td>
                    <img style="width:20px;height:20px;margin-top: 5px;float:right" src="img/arrowright.png" onclick="incriment()"/>
                </td>
            </tr>
        </table>
    </div>
</div>

JS

<script type="text/javascript" src="js/iscroll.js"></script>
<script>
    document.addEventListener('DOMContentLoaded', function () {
        setTimeout(loaded, 200);
    }, false);

    var myScroll1;
    function loaded1() {
        var height = $('#div_id').height();
        $("#div_id").css({"height": height+"px"});

        _.delay(function() {
            myScroll1 = new iScroll($('#div_id').get(0), {desktopCompatibility:true});
        }, 500);
    }
</script>