Google chrome ile svg'yi bir img etiketiyle oluşturmama konusunda sorunlar yaşıyorum. Bu, sayfa yenilenirken ve ilk sayfa yüklemesi sırasında olur. "Eleman İnceleniyor" ve ardından svg dosyasına sağ tıklayıp svg dosyasını yeni bir sekmede açarak görüntünün gösterilmesini sağlayabilirim. Daha sonra svg resmi orijinal sayfada görüntülenecektir.
<img src="../images/Aged-Brass.svg">
Sorunun ne olduğu konusunda burada tamamen kayıp. Svg resmi, Chrome veya Safari'de değil, IE9 ve FF'de iyi işliyor.
MIME türlerimi de ayarladım. (resim / svg + xml)
DÜZENLEME: Sorunumu göstermeye yardımcı olması için oluşturduğum basit bir html sayfası.
<!DOCTYPE html>
<html>
<head>
<title>SVG Test</title>
<style>
#BackgroundImage{
background: url('../images/Aged-Brass.svg') no-repeat scroll left top;
width: 400px;
height: 600px;
}
#ImageTag{
width: 400px;
height: 600px;
margin: 0px;
padding: 0px;
}
</style>
</head>
<body>
<div id="ImageTag">
<img src="../images/Aged-Brass.svg">
</div>
<div id="BackgroundImage"></div>
</body>
</html>
Gördüğünüz gibi bir svg dosyasını hem img etiketinde hem de css'de arka plan görüntüsü olarak kullanmaya çalışıyorum. Chrome veya safari'de ilk sayfa yüklemesinde çalışmayın. Öğeyi incelediğimde svg'ye sağ tıkladığımda veya başka bir pencerede svg yüklemesine bağlantıya tıkladığımda svg dosyası orijinal sekmede görüntülenecektir.