svg Bild funktioniert nicht in Safari 5.1.7 (Windows)

Svg Bild funktioniert nicht in Safari 5.1.7 (Windows). Aber wenn ich das SVG-Bild in Safari öffne und dann die Seite besuche, wird das Bild dort angezeigt.svg Bild funktioniert nicht in Safari 5.1.7 (Windows)

Quelle

2016-09-20 Cspk Isb

Bitte seien Sie klarer, was Ihr Problem ist. Was bedeutet "nicht funktionieren"? Sie sagen "besuchen Sie die Website" - welche Seite? –

Ich entwickle eine Website, in der ich Svg Bilder verwende, wie diese , jetzt, wenn ich die Seite in Chrom besuchen, funktioniert es gut, aber wenn Sie es in der Safari besuchen, wird Svg Bilder dort nicht angezeigt. Aber wenn ich das Svg-Bild in der Safari öffne, wird es auf der Website angezeigt. –

Meinst du, wenn du das SVG direkt lädst (zB www.my.site/somefile.svg), dann funktionieren die Bilder, die vorher nicht angezeigt wurden, jetzt? –

Safari unter Windows hat bekannte Probleme bei der Berechnung der Höhe von reagierenden Inline-SVGs.

Man könnte versuchen, die intrinsic ratio Technik, wobei man die <svg> Tag absolut innerhalb eines <object>-Tag mit Bodenpolsterung gleich dem Verhältnis des viewBox (oder Höhe/Breite-Attribute) des SVG positionieren.

.my-responsive-svg { 
 
    width: 100%; 
 
    display: block; 
 
    height: auto; 
 
    position: relative; 
 
    /* for an svg with a 16:9 aspect ratio */ 
 
    padding-top: 56.25%; 
 
} 
 

 
.my-responsive-svg svg { 
 
    width: 100%; 
 
    height: 100%; 
 
    position: absolute; 
 
    top: 0; 
 
    left: 0; 
 
    right: 0; 
 
}

<object class="my-responsive-svg"> 
 
    <svg width="160" height="90" viewBox="0 0 160 90"> 
 
    <rect x="10" y="10" width="140" height="70" /> 
 
    </svg> 
 
</object>

Quelle: Hutspitze zu Sérgio Lopes, der auf this blog post kommentiert.

Quelle

2017-06-09 13:02:48 JamesWilson

svg Bild funktioniert nicht in Safari 5.1.7 (Windows)

Antwort

Verwandte Themen