iScroll不顯示滾動條，但可以拖動內容

Question

這就是我所說的

document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);
document.addEventListener('DOMContentLoaded', function () { setTimeout(loaded, 200); }, false);

/**/
$(document).ready(function() {
    //Created an array for adding n iScroll objects
    var myScroll = new Array();

    $('.content').each(function(){
        if($(this).attr('id')==null){
            $(this).attr('id') = $(this).attr('class');
        }
        id = $(this).attr('id');
        console.log(id);
        $(this).html('<div class="scroller">'+$(this).html()+'</div>');
        myScroll.push(new iScroll(id));
    });
});

我對其進行了一些修改，以便您可以將其與類一起使用，而不僅限於id。

它似乎有效（啟用），因為我可以拖動容器及其內容（ 但不會保持位置 ，它將在鼠標釋放時恢復）

如果您想查看它的發生，請訪問http://toniweb.us/grano並單擊菜單中的任何項目，新顯示的內容即會生效。

知道為什么它起作用但未達到預期效果嗎？

我之所以要這樣做，是因為容器具有多個子容器，這些子容器將根據內容選擇而隱藏或顯示。

CSS：

#nvl1{
    padding:0px 25px;
    z-index:10;
    position:absolute;
    left:0px;
    background:url("../img/fondoNivel2.jpg") no-repeat scroll right 0 #79797B ; 
    height:100%;
}



#nvl1 .content{
        width:650px;
        z-index:11;
        display:none;
        color:#6666b6b;
        position:relative;
        line-height:30px;
    }

Answer 1

我在以下網址上查看了您的代碼： http ： //toniweb.us/grano

我認為您想做的是在班級上使用“滾動”功能使用iScroll。 那不是您在以下代碼中所做的，而是實際上是在將iScroll設置為使用滾動條DIV的父級：

id = $(this).attr('id');
$(this).html('<div class="scroller">'+$(this).html()+'</div>');
myScroll.push(new iScroll(id));

供參考：iScroll使用ID而不是類

這樣做的效果是，它會在緊隨其后的塊級元素（滾動條DIV）上引起“快照”效果。

考慮下面的示例，其中有一個DIV（id =“ scroller”）包含一個OL，該OL包含許多（塊級別）LI：

http://cubiq.org/dropbox/iscroll4/examples/simple/

長話短說，給您的DIV加上scroller類一個ID，然后從中創建iScroll。

Answer 2

如果您在div標簽上設置style ，則將滾動條置於（示例）上

style="position:relative;overflow: hidden;height:350px;

我認為這是明確設置高度，應該可以解決拖動問題

Answer 3

你不只是想要：

.content {overflow-y:scroll;}

那不是你所說的伴侶嗎？

Answer 4

滾動div中的元素不能浮動。 如果它們浮動且未清除，則頁面流程將意味着您的滾動div高度不正確。 嘗試避免在滾動和div中出現任何浮點，然后看看效果如何。 這是我的問題。

我還發現Matthews的答案很有幫助，因為我還在錯誤的div上調用了iscroll。 我認為關於iScroll示例的令人困惑的事情是，很容易假設使用ID滾動條在div上調用了iScroll，但是在包裝div上調用了iScroll。 帶有ID滾動條的div實際上並不需要ID，我認為出於示例的考慮，沒有該ID會更清楚。 例如

<div id="wrapper">
    <div>
         <p>Whatever you want here</p>
         <ul>
             <li>1</li>
         </ul>
    </div>
</div>
...
myScroll = new iScroll('wrapper');