标签: safari

禁用输入文本颜色

下面的简单HTML在Firefox和基于WebKit的浏览器中显示不同(我在Safari,Chrome和iPhone中检查过).

在Firefox中,边框和文本都具有相同的颜色(#880000),但在Safari中,文本变得更轻(就好像它应用了一些透明度).

我可以以某种方式解决此问题(在Safari中删除此透明度)?

更新:
谢谢你的回答.我不再需要这个用于我的工作(而不是禁用我input用样式div元素替换元素),但我仍然好奇为什么会发生这种情况,如果有任何方法可以控制这种行为......

<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>
Run Code Online (Sandbox Code Playgroud)

html css iphone safari webkit

80
推荐指数
7
解决办法
7万
查看次数

iPhone浏览器默认为密码字段的第一个字母大写

我正在为我的webapp的移动版本编写一个登录页面,我有一个简单的HTML密码字段,如下所示:

<input id="password" type="password" />
Run Code Online (Sandbox Code Playgroud)

唯一的问题是iPhone Safari浏览器默认大写输入的第一个字母,这使我的用户感到困惑,因为密码区分大小写并且他们并不总是意识到这种情况.

有没有人知道方法,标签或其他方式来阻止这种情况发生并强制iPhone输入为小写,除非用户另有说明?或者这只是平台的一个功能,无法改变?

html iphone safari user-interface

80
推荐指数
2
解决办法
3万
查看次数

为什么Safari页面会破坏iOS渲染?

我知道标题不是那么解释,但这是故事:我正在开发一个浏览器游戏,主要使用JavaScript和Mapbox库.

在桌面,Android和iOS上一切都运行良好但在iOS上出现一个问题:在让游戏运行几分钟之后,手机突然开始出现图形伪影并显示大部分文本乱码.

以下是一些手机开始的照片: 在此输入图像描述 在此输入图像描述 在此输入图像描述

我的问题是:我的代码究竟是什么导致了这个?内存泄漏?(LE:事实证明它实际上是一个内存泄漏)
真正的问题是:你怎么能通过浏览网页几乎把整个手机搞得一团糟?Safari不应该停止这个,或者至少是iOS吗?

这不是这个特定设备的问题,因为这个问题可以在不同的iPhone设备上重现.(我对不同的iOS版本不太确定).

我如何重现错误:

  1. 打开游戏(在Safari中).
  2. 让它运行3-4分钟.
  3. 向下滑动通知中心,一切都变得疯狂.
    我添加了一段YouTube视频,展示了如何重现错误(在我的iPhone 5C上).
    似乎问题首先出现在通知中心(如果您从顶部向下滑动菜单).
    至于现在,这个问题似乎只发生在iPhone 5CiOS 9.2.1(13D15)上.它也出现在新的iOS 9.3版本上.

为了解决这个问题,我必须:

  1. 关闭Safari应用程序(游戏选项卡打开).
  2. 锁定手机.解锁后一切恢复正常.

关于游戏本身的一些细节:

  1. 游戏显示一个Mapbox地图和一些单位(标记).
  2. Node.js服务器以1滴/秒的速度运行,每次滴答后,更新的游戏状态通过Socket.io发送到浏览器.
  3. 每次浏览器收到游戏状态时,它都会相应地更新标记.
  4. *如果您放大或缩小或者选择它们,游戏也可能会更新标记.

EDIT2: 发现内存泄漏(如预期).修复此泄漏(检查undefined_icon)后,问题不再发生.这意味着,在这些行的某处,触发了Safari/iOS错误.

对于每个聚类的单元(隐藏在MarkerCluster中并与其他单元组合在一起),以下是每个tick的确切调用内容:

    var $icon = $(marker._icon); // marker._icon is undefined because of the clustering

    $icon.html('');

    $icon.append($('<img class="markerIcon" src="' + options.iconUrl + '" />'));

    var iconX = 10;
    var iconY = -10;
    var iconOffset = 0;

    for(var v in …
Run Code Online (Sandbox Code Playgroud)

javascript iphone safari artifacts ios

79
推荐指数
1
解决办法
4827
查看次数

使用Chrome DevTools调试iOS 6 + 7 Mobile Safari

iOS 6内置支持远程调试(1分钟截屏视频).它适用于新的Safari Web Inspector,它似乎是一个1年前的WebKit Inspector分支.它错过了一些功能,如JS编辑和WebSocket框架检查.

Safari的Web检查器确实使用WebKit远程调试协议.但是,Safari不使用TCP/HTTP作为传输层,因此使其与Chrome不兼容.

苹果公司的Timothy Hatcher(又名Xenon)表示

  • Safari用于传输层的是什么?
  • 我可以从这个神秘的传输层创建代理到HTTP,以使其与Chrome DevTools一起使用吗?

safari mobile-safari web-inspector ios google-chrome-devtools

78
推荐指数
1
解决办法
4万
查看次数

无法隐藏Safari iOS 7 for iPhone/iPod touch中的导航栏

我不相信有任何解决方案可以使用javascript/css/html以编程方式隐藏栏,但让我试着描述一个问题.我们是移动游戏开发者团队,我们一直在开发游戏一年.

在iOS 7发布后,我们遇到了隐藏导航栏是不可能的问题.一旦用户点击Safari浏览器的上部或下部,导航栏就会再次出现并隐藏游戏的所有控件.

到目前为止我们找到的唯一解决方案是强制用户:

  1. 旋转设备
  2. 滚动页面
  3. 将应用程序添加到主屏幕

这些替代方案都不可接受.Apple似乎意识到了这个问题,但一直忽视它.他们关闭了一个报告的bug作为bug#14076889的副本.

我相信我们不是唯一遇到同样问题的团队.有谁知道解决方案?

javascript safari html5 ios ios7

78
推荐指数
3
解决办法
7万
查看次数

NodeJS/express:缓存和304状态代码

当我重新加载使用express制作的网站时,我得到一个使用Safari(而不是Chrome)的空白页面,因为NodeJS服务器向我发送了304状态代码.

怎么解决这个?

当然,这也可能只是Safari的问题,但实际上它适用于所有其他网站,所以它也必须是我的NodeJS服务器上的问题.

要生成页面,我正在使用Jade res.render.

更新:似乎发生此问题是因为Safari发送'cache-control': 'max-age=0'重新加载.

更新2:我现在有一个解决方法,但有更好的解决方案吗?解决方法:

app.get('/:language(' + content.languageSelector + ')/:page', function (req, res)
{
    // Disable caching for content files
    res.header("Cache-Control", "no-cache, no-store, must-revalidate");
    res.header("Pragma", "no-cache");
    res.header("Expires", 0);

    // rendering stuff here…
}
Run Code Online (Sandbox Code Playgroud)

更新3: 所以完整的代码部分目前是:

app.get('/:language(' + content.languageSelector + ')/:page', pageHandle);

function pageHandle (req, res)
{
    var language = req.params.language;
    var thisPage = content.getPage(req.params.page, language);

    if (thisPage)
    {
        // Disable caching for content files
        res.header("Cache-Control", "no-cache, no-store, must-revalidate");
        res.header("Pragma", "no-cache");
        res.header("Expires", 0); …
Run Code Online (Sandbox Code Playgroud)

safari caching node.js http-status-code-304 express

78
推荐指数
2
解决办法
8万
查看次数

Flexbox无法处理按钮或字段集元素

我试图<button>用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;
}
Run Code Online (Sandbox Code Playgroud)
<div>
  <button>
    <span>Test</span>
    <span>Test</span>
  </button>
  <p>
    <span>Test</span>
    <span>Test</span>
  </p>
</div>
Run Code Online (Sandbox Code Playgroud)

还有一个jsfiddle:http: //jsfiddle.net/z3sfwtn2/2/

html css safari css3 flexbox

78
推荐指数
2
解决办法
3万
查看次数

HTML5视频标记在Safari,iPhone和iPad中无法使用

我正在尝试创建一个html5网页,其中有一个像13s的小视频,我将此视频的flash版本转换为3格式:.ogv使用fireFogg,.webm使用firefogg也和.mp4使用HandBrake应用程序html脚本我在我的页面中使用过:

<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>
Run Code Online (Sandbox Code Playgroud)

该视频在Chrome和FireFox中运行良好,但在桌面上的Safari和iPhone或iPad上都无法正常工作,输出只是一个空白页面,显示视频标签的控件但没有加载任何内容

请注意,我支持的Safari版本支持HTML5视频

iphone safari mobile-safari ipad html5-video

77
推荐指数
10
解决办法
26万
查看次数

如何在我的网站上启用iOS 5 Safari Reader?

iOS 5中Mobile Safari的Reader功能如何工作?如何在我的网站上启用它.如何告诉我页面上的哪些内容是触发此功能的文章?

safari mobile-safari ios5

75
推荐指数
4
解决办法
4万
查看次数

iOS 7 - 有没有办法在Safari中禁用滑动后退和前进功能?

对于某些网页,我们使用iPhone的左右滑动功能来拉取菜单.现在使用iOS7,他们已经引入了在向左和向右滑动的情况下返回到前一页和下一页浏览器历史记录的功能.

但有没有办法为特定页面禁用它,以便在滑动操作上没有冲突的行为?

safari ios ios7

75
推荐指数
3
解决办法
4万
查看次数