scrollLeft工作，但scrollTop的不工作

我與CSS .container { overflow: scroll; }等下面的HTMLscrollLeft工作，但scrollTop的不工作

<body> 
<div class="container"> 
    <div id="markers"></div> 
    <img id="map" src="/img/map.jpg"/> 
</div> 
</body>

map.jpg是非常大的，我想滾動到這樣一個固定的位置：

$(function(){ 
    console.log($('.container').scrollTop()); 
    $('.container').scrollTop(1000); 
    console.log($('.container').scrollTop()); 
    console.log($('.container').scrollLeft()); 
    $('.container').scrollLeft(1750); 
    console.log($('.container').scrollLeft()); 
});

scrollLeft工作正常，但scrollTop沒有。以下是控制檯輸出。

我一直在尋找了半個多小時，但仍然不知道如何解決它......

UPDATE： CSS約.container#markers和#map

.container { overflow: scroll; width: 100%; max-width: 100%; height: 100%; max-height: 100%; margin: 0; padding: 0; } 
#map { width: 5000px; max-width: 5000px; height: 2907px; max-height: 2907px; cursor: crosshair; } 
#markers { position: relative; top: 0; left: 0; width: 0; height: 0; margin: 0; padding: 0; }

來源

2012-12-08 Xiao Jia

您能否向我們展示更多關於.container，＃標記和#map的CSS代碼？ – Sybio

@Sybio我已經更新了這個問題。 –

奇怪的是，也許嘗試溢出：自動.container而不是滾動。 – Sybio

經過幾次試驗後，我設法通過將position: absolute;添加到.container

來源

2012-12-08 11:02:45

檢查這個代碼，也ü可以在這裏獲得一個活生生的例子http://jsfiddle.net/sarfarazdesigner/2uvRe/

這是HTML代碼

<div class="demo"> 
    <h1>lalala</h1> 
    <p>Hello</p> 
</div>

這是CSS代碼

div.demo { 
background:#CCCCCC none repeat scroll 0 0; 
border:3px solid #666666; 
margin:5px; 
padding:5px; 
position:relative; 
width:200px; 
height:100px; 
overflow:auto; 
} 
p { margin:10px;padding:5px;border:2px solid #666;width:1000px;height:1000px; }

這是javascript代碼

$("div.demo").scrollTop(300); 
    $("div.demo").scrollLeft(300);

來源

2012-12-08 11:44:37

scrollLeft工作，但scrollTop的不工作

回答

相關問題