1

（这个问题是Safari Scrollbars & SVG的后续问题- 建议的解决方法是使用 javascript，但 Safari 甚至没有响应 javascript。甚至是直接的 css。）

我无法从 Safari 获得全尺寸的 svg。它根本拒绝放大。我希望 min-width 遵循 jquery 窗口宽度，但它忽略了 javascript（其他浏览器似乎很好），然后即使我直接更改 css，它甚至忽略“宽度：700px;”

SVG 文件

  viewBox="0 0 800 800"

（未指定高度或宽度）

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"> 

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <style type="text/css">
   .objectwrapper{
    max-width: 80%;
    margin-right:auto;
    margin-left:auto;
  }
 .objectdiv{
    max-width: 100%;
    margin-right:auto;
    margin-left:auto;
    display:block;
  }
 .svg{
    width:100%;
    display:block;
  }
 </style>
 <script type="text/javascript"      
  src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
 <script  type="text/javascript">

  var sixtypercentInnerWidth = .6*$(window).width();


  $("document").ready(function(){
      $(".objectwrapper").css("max-width",sixtypercentInnerWidth);
  });
  </script>
</head>
<body>
 <div class="objectwrapper">
 <div class="objectdiv">
         Object4
        <object class="svg" type="image/svg+xml"       data="question0optimize1.svg" >      
         </object>   

 </div>
 </div>

 </body>
 </html>

编辑

我刚刚发现编辑 .svg 得到了一些回应......

   $("document").ready(function(){
        $(".svg").css("width",sixtypercentInnerWidth);
        $(".svg").css("height",sixtypercentInnerWidth);
    });

我需要添加高度和宽度..所以看起来 SAFARI 不能做 svg %'s???????

4

2 回答 2

1

Safari 绝对有能力使用 CSS 调整 SVG 元素的大小。我每天都这样做:)

你的原因

.svg{
width:100%;
display:block;

}

不适用是因为您的 objectwrapper 和 objectdiv 元素在 CSS 中没有明确的宽度。最大宽度是不够的。给这些父元素一个明确的 100% 宽度，这应该可以解决问题。不需要在这个上用 JS 绕弯子。

相关的几点：

a) Jquery 选择器和函数通常不能很好地与 SVG 一起使用。我在路径属性上使用了 jquery animate 方法，仅此而已。其他一切都失败了。你需要编写 vanilla js 来使用 SVG 做很多事情。

b) 在 Chrome 中对 SVG 进行故障排除要容易得多。开发工具仍然有一些奇怪的 SVG 错误正在解决，但通常如果它在 Chrome 中工作，它在 Safari 中也能工作。

于 2012-05-25T02:12:32.947 回答
0

在我看来，safari 完全有能力在 os x、windows 或 ios 上执行 svg。我不使用，但我发现 JQuery 有时对 svg 不直观。在动画方面，我什至会做一些 javascript 支持的动画，可以在除 MS IE 之外的所有浏览器中使用。

于 2012-04-13T15:07:44.960 回答