让针对 Webkit 优化的网站兼容 WP8 IE10

3顶
1踩

2012-11-16 12:25 by 副主编 wangguo 评论(1) 有9275人浏览

webkit ie windows phone html5

声明：ITeye资讯文章的版权属于ITeye网站所有，严禁任何网站转载本文，否则必将追究法律责任！

微软Windows Phone开发者博客今日发表了一篇博文，阐述了如何让针对Webkit浏览器（iOS或Android）优化的网站完美运行于Windows Phone 8的IE10浏览器上。

微软表示，由于IE10大大改善了对于HTML5的支持，因此，开发者可以轻松使针对WebKit浏览器优化的网站也支持IE10，这意味着开发者只需更改少量的代码，即可为用户提供统一的浏览体验。

第1步：检测Windows Phone 8版IE10浏览器

微软之前公布了IE10的user-agent字符串：

Mozilla/5.0 (compatible; MSIE 10.0; Windows Phone 8.0; Trident/6.0; ARM; Touch; IEMobile/10.0; <Manufacturer>; <Device> [;<Operator>])

这个过程完成后，如果还存在差异，最好采用特征检测，或者参照其他编写跨浏览器代码的最佳实践。需要注意的是，WP8中的IE10不支持Flash视频，因此，请确保网站中使用的是HTML5视频。

此外，还需要更新网站依赖的第三方库，如jQuery Mobile，确保支持最新的浏览器。

第2步：确保使用标准模式

确保IE10以最符合标准的模式来渲染你的网站。可以采用以下方式：

使用HTML5 doctype：<!DOCTYPE html>
可以在HTTP头中添加<meta http-equiv="x-ua-compatible" content="IE=edge" />指定使用最新的IE版本来渲染

第3步：更新CSS和DOM API

你还需要对网站的一些代码进行更改，最简单的方式是，将一些针对WebKit的特定CSS属性或JavaScript方法，更改为不带前缀的标准形式或带MS前缀的形式。

详见：CSS and DOM API updates

第4步：更新触摸和鼠标事件

WebKit和IE10对于触摸和鼠标事件的处理是不同的。WebKit的触摸事件接口与鼠标处理事件是分开的，而IE10将触摸、鼠标和手写笔事件整合到了一个接口中。因此，需要对代码进行调整。

详见：Updating touch and pointer events

第5步：处理不标准的行为

最后需要处理其他未形成W3C标准的方法。在这些情况下，WebKit和IE10解决方案可以共存于一个网站中。

Via Windows Phone开发者博客

查看图片附件

分享到：

3
顶

1
踩

评论共 1 条请登录后发表评论

1 楼 lonelybug 2012-11-18 23:19

我觉得微软现在还生活在错觉中，他应该修改自己的IE10来更贴近HTML5相关标准，因为现在已经不是她一家独大的时代了。再加上浏览网页很多通过ipad等设备其基本运行已webkit为核心的浏览器。

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

可以本地上传图片的FreeTextBox Demo

可以本地上传图片的FreeTextBox.网络上的Freetextbox只可以插入网络地址。

FreeTextBox 研究 -- FreeTextBox 类

FreeTextBox 研究 -- FreeTextBox 类 FreeTextBox 派生自 System.Web.UI.Control 类，而不象普通Web控件那样派生自： System.Web.UI.WebControls.WebControl 类。System.Web.UI.Control 类是 System.Web.UI.WebControls.WebControl 类的基类。

FreeTextBox使用指导

FreeTextBox使用指导 1. 下载免费的FreeTextBox第三方插件 下载地址： http://dl5.csdn.net/fd.php?i=947824925517358&s=1ef5431b527317bd9300e14e407dce0e 2. 下载压缩文件后解压，打开bin文件夹将FreeTextBox.dll复制到你自己网站的bin文件夹下（没有的话，自己先创建bin文件夹

给FreeTextBox添加上传图片功能

在项目中用了FreeTextBox作为编辑器，非常方便，但美中不足的是需要通过相册来插入上传的图片，虽然功能比较强大，但用户还是觉得比较麻烦，所以就在网上搜索了一番，还真找到了宝玉大大发的一篇。按照宝玉的文章，我做了一个demo，但发现有错误，原来宝玉是在04年发表的文章，是针对那时候的FreeTextBox的，而我现在用的是3.1.6。于是就仔细得看了看代码，找到了解决方法，贴出来与大家分享。 ...

关于FreeTextBox中的图片上传小结

弄了一个FreeTextBox来玩.好象目前最高版本3-1-3.下载下来发现default的设置没有上传文件的功能.看了一下,也不难.以下作为小结,可能以后用的到. 如何设置FTB的example?在此文件夹内新建一个名为bin的文件夹,并把你想用的版本的FreeTextBox.dll 放进去.在此文件内新建一个名为web.config的文件,写入以下代码: Code hi

最简单的网页编辑器

最简单。最实用，最快捷bbyjywyzz.rar

FreeTextBox的使用（C#）

FreeTextBox的使用（C#） FreeTextBox的使用（C#） FreeTextBox的使用（C#）

烂泥：HTML编辑器中使用img插入图片

本文首发于: 烂泥行天下 www.lanni654321.com 首先，要说明一点，我现在使用的这个系统的网络编辑器，不支持图片的插入功能。但是，我现在要实现这个功能，因为在我的文章中要出现大量的图片。如果不能插入图片的话，那是一件很纠结的事情，而且也会影响到整篇文章的效果。其次，对于HTML语言我是不懂的，也没有时间去学习它了。而我现在的目的就是要把服务器上已经上传的图片，插入到...

“FreeTextBox”控件使用——Word编辑器

前言在敲牛腩新闻发布系统时，添加新闻修改新闻的时候遇到了Word编辑器控件。它是引用了第三方控件，下面关于怎么引用该控件及其一些简单的使用方法进行分析。内容在网上找的该插件“FreeTextBox”。首先在Web程序下进行FreeTextBox的引用在工具箱添加该工具：右键选择项进行工具添加 ...

在线编辑器（FreeTextBox）

最近忙于项目当中，碰到一个让人郁闷的问题。在测试网站在不同IE中页面问题时，发现在一直用的在线文本编辑器，竟然不能正常显示。IE8中解析为textArea。经查找资料，是FreeTextBox没跟上IE8变化。所以要解决的话必须下最新的版本。让人哭笑不得。

怎么在html中复制粘贴图片,如何复制其他网页上的文章和图片

首先，我们并不建议直接复制别人的内容，以免侵权。但是不排除在某些情况下，需要将其他网页上的内容完整的复制到你的网站中。比如，将自己的微博文章复制到自己的网站。大部分人都知道这个简单的方法，先选中目标文字按CTRL+C快捷键，然后再网站后台文本编辑器中安CTRL+V粘贴即可。但是如果文章中有插图呢？图片文件会不会自动上传到网站中来？下面就来详细介绍一下这个过程。复制了网页内容后，粘贴到文本编辑器中往...

freetextbox java_FreeTextBox的应用技巧

简介：对于FreeTextBox(版本3.1.6)在ASP.Net 2.0中使用,只需要2个文件：FreeTextBox.DLL和ftb.imagegallery.aspx1。下载最新版FreeTextBox(版本3.1.6),解压FreeTextBox 3.1.6 (2006/07/18)博客园本地下载： http://www.cnblogs.com/Files/cleo/FTBv3-1-6.z...

几款常见的可视化HTML编辑器(WYSIWYG).

目前HTML编辑器可以说是种类繁多, 特别是国外, 开源的商业的, 各种版本, 不一而足. 我只是简单介绍几个常见的免费/开源的可视化HTML编辑器 (WYSIWYG).HTMLArea功能一般, 文件不大, 支持是几种语言, 比较容易定制, 使用广泛,支持IE/Firefox/Mozilla等多种浏览器. 遵循BSD版权, 目前最新版是3.0.官方网站: http://www.htmlarea

可插入图片的FreeTextBox(源码)

本控件是在FreeTextBox 1.6.3 中文版基础上增加上传图片的功能，上传的图片保存在upimage文件夹下. 演示地址: http://www.gdqd.com/test.aspx源代码下载转载于:https://www.cnblogs.com/k98188/archive/2006/10/08/523837.html...

3顶1踩