Questions tagged «safari»

Safari是Apple的网络浏览器，是macOS和iOS上的默认浏览器。

10
我没有Mac时在Mac / Safari上测试Web应用程序
最近，当我启动的网站在Windows上的IE，Firefox，Chrome和Safari上完美显示时被发现，但是在Mac上使用Safari浏览时（潜在客户）损坏了，我需要开始测试我的网站的外观在Mac上查看。 问题是，我没有Mac。 我尝试过BrowsrCamp，它声称可以为安装了许多浏览器的Mac提供VNC访问，但是发现它不可靠（到目前为止，在过去5天中已经工作了1天），我需要另一个解决方案。 有什么建议？
122 macos  safari 
3
使用诸如SystemJS之类的模块加载器时，可以在Safari的Web检查器中进行调试
我创建一个Ionic使用应用程序es6 modules，TypeScript并SystemJS作为一个模块加载器。这是我的设置： tsconfig.json： { "compilerOptions": { ... "target": "es5", "module": "system", ... } } index.html： <script src="lib/system.js"></script> <script src="systemjs.config.js"></script> <script>System.import('js/app.js')</script> 示例脚本（TypeScript）： import {IConfig} from "./app-config"; export class ConfigLoader { ... } Chrome一切正常。但是，在使用Safari的Web Inspector进行调试时，我无法在脚本中放置任何断点，因为Web Inspector仅显示直接从HTML（通过脚本标记）加载的脚本，而不显示XHR（在我的情况下是通过SystemJS）加载的脚本。这意味着我无法调试自己的脚本，这当然是不可接受的。 我试图像以前一样通过使用SystemJS来解决此问题，但也将脚本标签放置在html中，如下所示： <script src="lib/system.js"></script> <script src="systemjs.config.js"></script> <script src="js/app-config.js"></script> ... other app scripts <script>System.import('js/app.js')</script> 但是，这不起作用，因为SystemJS对此并不满意： 无效的System.register调用。匿名System.register调用只能由SystemJS.import加载的模块进行，而不能通过脚本标签进行。 如何使用SystemJS，同时又可以在Safari中进行调试？我正在寻找比“在每个脚本中放入调试器语句”更复杂的解决方案。
7
如何在Mac上的Safari中删除选择元素的光泽？
在Mac和iOS设备上，在Safari中，<select>具有背景颜色的元素会在其自身上方产生光泽。在其他操作系统中似乎不会发生这种情况。 例如，我有一个具有以下样式属性的select元素： select { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; padding: 3px 6px; margin: 10px 0 7px; width: 250px; background-color: #BD2786; color: white; letter-spacing: -.04em; font-weight: bold; border: 0; } 我的元素具有所需的背景色，但光泽仍然存在。有谁知道如何使其成为纯色？
1
在Safari 10中旋转时，SVG会更改颜色
我刚遇到一个非常奇怪的问题，该问题只在Safari 10中显示。我有纸牌，svg图像，有时会使用来旋转transform:rotate(xdeg)。 我正在使用的卡有红色方块图案。当它不旋转或以直角（即90、180、270）旋转时，它看起来很正常。但是，除此以外的任何角度都将使背景图案变成蓝色！我刚刚从一个用户那里得到了一份关于此的报告，却从未见过如此怪异的东西。其他浏览器均正常运行，Safari 9正常运行。 我猜这只是Safari 10中一个非常奇怪的错误，但是有关如何解决它的任何想法？我在以下位置创建了最小复制： https://jsfiddle.net/2zv4garu/1/
109 html  css  svg  safari 
13
JavaScript中匿名函数上的removeEventListener
我有一个包含方法的对象。这些方法被放入匿名函数内部的对象中。看起来像这样： var t = {}; window.document.addEventListener("keydown", function(e) { t.scroll = function(x, y) { window.scrollBy(x, y); }; t.scrollTo = function(x, y) { window.scrollTo(x, y); }; }); （还有很多代码，但这足以显示问题） 现在，在某些情况下，我想停止事件监听器。因此，我试图做一个removeEventListener，但我不知道如何去做。我已经读过其他问题，无法在匿名函数上调用removeEventListener，但是在这种情况下也是如此吗？ 我在匿名函数内部创建了一个t方法，因此我认为这是可能的。看起来像这样： t.disable = function() { window.document.removeEventListener("keydown", this, false); } 我为什么不能这样做？ 还有其他（好的）方法吗？ 奖金信息；这仅在Safari中有效，因此缺少IE支持。
14
iOS Safari –如何禁用过度滚动但允许可滚动的div正常滚动？
我正在使用基于iPad的Web应用程序，因此需要防止滚动过度，以使其看起来不像是网页。我目前正在使用它冻结视口并禁用过度滚动： document.body.addEventListener('touchmove',function(e){ e.preventDefault(); }); 这对于禁用过度滚动非常有用，但是我的应用程序具有多个可滚动的div，上面的代码可以防止它们滚动。 我仅针对iOS 5及更高版本，因此避免了像iScroll这样的恶意解决方案。相反，我将此CSS用于可滚动div： .scrollable { -webkit-overflow-scrolling: touch; overflow-y:auto; } 这在没有文档过度滚动脚本的情况下有效，但不能解决div滚动问题。 如果没有jQuery插件，是否有任何方法可以使用过度滚动修复程序，但可以免除我的$（'。scrollable'）div？ 编辑： 我发现了一个不错的解决方案： // Disable overscroll / viewport moving on everything but scrollable divs $('body').on('touchmove', function (e) { if (!$('.scrollable').has($(e.target)).length) e.preventDefault(); }); 滚动经过div的开头或结尾时，视口仍会移动。我也想找到一种方法来禁用它。
3
在Safari中隐藏textarea调整大小句柄
我在应用程序中使用textarea组件，并动态控制它们的高度。随着用户的键入，只要有足够的文本，高度就会增加。在IE，Firefox和Safari上运行良好。 但是，在Safari中，右下角有一个“句柄”工具，允许用户通过单击和拖动来调整文本区域的大小。我还在stackoverflow的“问问题”页面中注意到了textarea的问题。该工具令人困惑，并且基本上会妨碍您的工作。 因此，是否有隐藏此调整大小手柄的方法？ （我不确定“ handle”是否正确，但是我想不出一个更好的词。）
97 safari  webkit  css 
12
固定元素获得焦点时，ios8中的Safari正在滚动屏幕
在IOS8 Safari中，有一个已修复位置错误的新错误。 如果您将焦点放在固定面板中的文本区域，则safari会将您滚动到页面底部。 这使各种UI都无法使用，因为您无法将文本一直输入到textareas中，而无需一直向下滚动页面并失去位置。 有什么办法可以彻底解决此错误？ #a { height: 10000px; background: linear-gradient(red, blue); } #b { position: fixed; bottom: 20px; left: 10%; width: 100%; height: 300px; } textarea { width: 80%; height: 300px; } <html> <body> <div id="a"></div> <div id="b"><textarea></textarea></div> </body> </html>
96 javascript  ios  css  safari  ios8 
10
禁用的输入文字颜色
下面的简单HTML在基于Firefox和基于WebKit的浏览器中的显示方式有所不同（我在Safari，Chrome和iPhone中进行了检查）。 在Firefox中，边框和文本都具有相同的颜色（#880000），但在Safari中，文本会变得更浅一些（好像已对其应用了一些透明度）。 我可以以某种方式解决此问题（在Safari中删除此透明度）吗？ <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <style type="text/css"> input:disabled{ border:solid 1px #880000; background-color:#ffffff; color:#880000; } </style> </head> <body> <form action=""> <input type="text" value="disabled input box" disabled="disabled"/> </form> </body> </html>
93 iphone  html  css  safari  webkit 
23
HTML5视频标签在Safari，iPhone和iPad中不起作用
我正在尝试创建一个html5网页，其中有一个类似于13s的小视频，我将该视频的Flash版本转换为3种格式：使用fireFogg的.ogv，还使用firefogg的.webm以及使用HandBrake应用程序的html脚本的.mp4我在我的页面中使用过： <video width="800" height="640" loop preload="false" autoplay controls tabindex="0"> <source src="xmasvideo/video.mp4" type="video/mp4" /> <source src="xmasvideo/M&P-Xmas 2.ogv" type="video/ogv" /> <source type="video/webm" src="xmasvideo/M&P-Xmas.webm" /> </video> 该视频在Chrome和FireFox上运行良好，但在Safari桌面版或iPhone或iPad上都无法正常工作，输出只是一个空白页，显示了视频标签的控件，但未加载任何内容 请注意，我拥有的Safari版本支持HTML5视频
3
Flex / Grid布局不适用于按钮或字段集元素
我正在尝试将<button>-tag的内部元素与flexbox的居中对齐justify-content: center。但是Safari不会将它们居中。我可以将相同的样式应用于任何其他标签，并且可以按预期工作（请参见<p>-tag）。仅按钮左对齐。 尝试使用Firefox或Chrome，您会发现其中的区别。 有什么我必须覆盖的用户代理样式？或对此问题有其他解决方案？ div { display: flex; flex-direction: column; width: 100%; } button, p { display: flex; flex-direction: row; justify-content: center; } <div> <button> <span>Test</span> <span>Test</span> </button> <p> <span>Test</span> <span>Test</span> </p> </div> 运行代码段隐藏结果展开摘要 和jsfiddle：http： //jsfiddle.net/z3sfwtn2/2/
91 html  css  safari  flexbox  css-grid 
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.