Turns out the android browser has this issue too.

Change the hack to just use top/left if chrome is being used, otherwise use transform.
Hopefully chrome fixes their issue so we can use transform everywhere instead.
This commit is contained in:
danzel 2012-07-17 11:58:04 +12:00
parent d6b0b02c3f
commit b663c7f442
3 changed files with 10 additions and 8 deletions

View File

@ -20,7 +20,7 @@
<input id="textField" name="textField" type="text" value="">
</fieldset>
</form>
Bug tested to occur on: Safari on Mac (Tested in 5.1.7), iPad/iPhone 5.1.1. Hack is in L.Browser.safari and TileLayer._addTile
Bug tested to occur on: Safari on Mac (Tested in 5.1.7), iPad/iPhone 5.1.1., Android 4 Browser. Hack is in L.Browser.chrome and TileLayer._addTile
</div>
<script type="text/javascript">
@ -31,8 +31,8 @@
key: 'BC9A493B41014CAABB98F0471D759707'
});
//Undo the hack fix
L.Browser.safari = false;
//Disable the hack fix
L.Browser.chrome = true;
var map = L.map('map')
.setView([50.5, 30.51], 15)

View File

@ -4,8 +4,8 @@
ie6 = ie && !window.XMLHttpRequest,
webkit = ua.indexOf("webkit") !== -1,
gecko = ua.indexOf("gecko") !== -1,
//Terrible browser detection to work around a safari / iOS browser bug. See TileLayer._addTile and debug/hacks/jitter.html
safari = (ua.indexOf("safari") !== -1 || ua.indexOf("iphone") !== -1 || ua.indexOf("ipad") !== -1) && ua.indexOf("applewebkit") !== -1 && ua.indexOf("chrome") === -1,
//Terrible browser detection to work around a safari / iOS / android browser bug. See TileLayer._addTile and debug/hacks/jitter.html
chrome = ua.indexOf("chrome") !== -1,
opera = window.opera,
android = ua.indexOf("android") !== -1,
android23 = ua.search("android [23]") !== -1,
@ -53,7 +53,7 @@
android: android,
android23: android23,
safari: safari,
chrome: chrome,
ie3d: ie3d,
webkit3d: webkit3d,

View File

@ -315,8 +315,10 @@ L.TileLayer = L.Class.extend({
// get unused tile - or create a new tile
var tile = this._getTile();
//Chrome 20 layouts much faster with top/left (Verify with timeline, frames), Safari 5.1.7 and iOS 5.1.1 have display issues with top/left and requires transform instead. (Other browsers don't currently care)
L.DomUtil.setPosition(tile, tilePos, !L.Browser.safari);
//Chrome 20 layouts much faster with top/left (Verify with timeline, frames),
//Safari 5.1.7, iOS 5.1.1, android browser (4.0) have display issues with top/left and requires transform instead. (Other browsers don't currently care)
//See debug/hacks/jitter.html for an example
L.DomUtil.setPosition(tile, tilePos, L.Browser.chrome);
this._tiles[key] = tile;