2015-12-10 29 views
6

Ben svg yabancı nesnenin içine div var içinde svg yabancı nesnesinin içinde çalışmıyor: autokaydırma taşma ile, krom

  • kaydırma sadece fare tekerleği ile çalışıyor, bu çalışır çubuğu
  • sürükleyemezsiniz firefox, ancak krom/safari hiçbir svg-g elemana dönüşümü eğer çalıştığını

bkz keman: http://jsfiddle.net/ranr/ncry8Lmx/

Kromda bir hata mı? etrafında herhangi bir şekilde?

<svg width="1000" height="800"> 
    <g transform="translate(100,50)"> 
    <rect x="4" y="4" width="110" height="90" stroke="#666666" fill="#eeeeee" /> 
    <foreignObject x="10" y="10" width="100" height="80"> 
     <div xmlns="http://www.w3.org/1999/xhtml" style="height:100%;overflow:auto;"> 
     <div>aaaaaa</div> 
     <div>bbbbbb</div> 
     <div>cccccc</div> 
     <div>dddddd</div> 
     <div>eeeeee</div> 
     <div>ffffff</div> 
     </div> 
    </foreignObject> 
    <g> 
</svg> 
+0

ayrıca bildirilen öğede chromium https://code.google.com/p/chromium/issues/detail?id=568614 –

cevap

0

Bu bir Chrome/Safari hatası olduğunu düşünüyorum. overflow:auto'u overflow:scroll olarak değiştirmeye çalışırsanız, div, foreignObject'un görüntüsünü görüntülemiştir.

0

Bu krom hatası kapatıldı, maalesef daha kötü görünüyor. Jsfiddle'ı açarsanız, bu div içeriği görünmezdir, ancak overflow:auto stilini kaldırırsınız. Test ettim, hala overflow-y:scroll ise görünmez. Chrome v62'de test edin. Firefox 57 iyi çalışıyor.

İlgili konular