單張與位置：固定葉灰痕跡滾動

Question

後，我試圖讓網站包含兩個div：

• 左，Y-滾動與內容
• 權利，而不是移動（位置固定），含只是一個標籤和傳單地圖

當我滾動頁面時，傳單留下灰色的痕跡，我想擺脫。

我在這裏找到的（在stackoverflow）是map.invalidateSize（），但它沒有幫助我。

Watch full jsfiddle example here。

HTML：

<div id="map">  
</div> 

<div id="content"> 
Heres the text<br /> 
    ... 
</div> 

CSS：

html, body, #map { 
    width: 100%; 
    height: 100%; 
} 
#map{ 
    width: 400px; 
    height: 400px; 

    position: fixed; 
    left: 60%; 
    top: 30%; 
} 

JS：

// create a map in the "map" div, set the view to a given place and zoom 
    var map = L.map('map').setView([51.505, -0.09], 13); 

    // add an OpenStreetMap tile layer 
    L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', { 
     attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors' 
    }).addTo(map); 

    window.map = map; 

$(document).ready(function(){ 
    $(window).scroll(function(){ 
     window.map.invalidateSize(); 
    }) 
}) 

Answer 1

將其更改爲background: none;

#map{ 
    width: 400px; 
    height: 400px; 
    background: none; 
    position: fixed; 
    left: 60%; 
    top: 30%; 
}