4903人阅读
浏览器兼容（1）
1.1 浏览器内核差别
1.2. Safari和Chrome浏览器简介
Safari和Chrome，一个是苹果公司MAC OS系统的浏览器，一个是Google开发的浏览器，它们都使用了同样的内核webkit，关于webkit，有如下简介。
　　 WebKit 是一个开源浏览器网页排版引擎，与之相应的引擎有Gecko（Mozilla，Firefox 等使用的排版引擎）和Trident（也称为MSHTML，IE 使用的排版引擎）。同时WebKit 也是苹果Mac OS X 系统引擎框架版本的名称，主要用于Safari，Dashboard，Mail 和其他一些Mac OS X 程序。WebKit 所包含的 WebCore 排版引擎和 JSCore 引擎来自于 KDE 的 KHTML 和 KJS，当年苹果比较了 Gecko 和 KHTML 后，仍然选择了后者，就因为它拥有清晰的源码结构、极快的渲染速度。
　　目前使用WebKit 引擎的浏览器主要有：Safari(apple出品)，Midori，chrome(google出品)等。
1.3. 改造问题汇总
在改造过程的测试及排查中，总结排查出来的共同点一共有以下数十点：
1.2.1 document.formName.item(&itemName&) 问题
说明:IE下,可以使用document.formName.item(&itemName&)或document.formName.item[&itemName&]或document.formName.elements[&elementName&];
W3C标准,只能使用document.formName.elements[&elementName&].
解决方法:统一使用document.formName.elements[&elementName&].
1.2.2 集合类对象问题
说明:IE下,可以使用()或[]获取集合类对象; Safari及Chrome下,只能使用[]获取集合类对象.
解决方法:统一使用[]获取集合类对象.
1.2.3 各种style描述需严格大小写
说明:IE下，各种CSS属性大小写要求不严格，均能正确操作。
Safari及Chrome下出现过因为大小写问题无法正确解析的情况，建议严格大小写。
解决方法：统一严格按照CSS属性大小编写。
1.2.4 自定义属性问题
说明:IE下,可以使用获取常规属性的方法来获取自定义属性,也可以使用getAttribute()获取自定义属性; 在Safari和Chrome下,只能使用getAttribute()获取自定义属性.
解决方法:统一通过getAttribute()获取自定义属性.
实例：&input type='text' id='comdiv' paic='it' style='display:block' style='font-size: 20' size='4'/&
IE下可以使用element.paic获取，在Safari和Chrome下只需要使用element. getAttribute('paic')
1.2.5 元素中不能有一处以上的style描述
说明:IE下,一个元素中可以多次style的定义，Safari及Chrome下，若有多次描述无法生效。 解决方法:统一元素中只存在一处的style描述。.
示例：&input type='text' id='comdiv' style='display:block' style='font-size: 20' size='4'/&
在IE下，示例中的两处style定义都会加载，在Safari和Chrome下只有第一处style会被加载。
1.2.6 eval(&idName&)问题
说明: 在Safari、Chrome及IE下,可以使用eval(&idName&)或getElementById(&idName&)来取得id为idName的HTML对象;Firefox下只能使用getElementById(&idName&)来取得id为idName的HTML对象.
解决方法:统一用getElementById(&idName&)来取得id为idName的HTML对象.
1.2.7 变量名与某HTML对象ID相同的问题
说明:IE、 Safari及Chrome下,HTML对象的ID可以作为document的下属对象变量名直接使用;Firefox下则不能。
解决方法:使用document.getElementById(&idName&)代替document.idName.最好不要取HTML对象ID相同的变量名,以减少错误;在声明变量时,一律加上var,以避免歧义.
1.2.8 获取对象方式
HTML对象的 id和name 在IE使用getElementByID都会找到，在Safari及Chrome中name是找不到的，必须严格使用getElementByID和getElementsByName.
解决方法：
id使用getElementByID
name使用getElementsByName
1.2.9 input.type属性问题
说明:IE下input.type属性为只读;但是在Safari及Chrome中下input.type属性为读写.
&input type='text' id='comdiv' size='4'/&
Safari及Chrome下，可以使用 comdiv.type ='button' 修改type类型。
1.2.10 模态和非模态窗口问题
说明:IE下,可以通过showModalDialog和showModelessDialog打开模态和非模态窗口; 在Safari及Chrome中则不能.
解决方法:直接使用window.open(pageURL,name,parameters)方式打开新窗口。
如果需要将子窗口中的参数传递回父窗口,可以在子窗口中使用window.opener来访问父窗口. 例如：var parWin = window. parWin.document.getElementById(&Aqing&).value = &Aqing&;
1.2.11 cursor:hand 和 cursor:pointer
firefox不支持hand，但ie、Safari及Chrome中支持pointer
解决方法: 统一使用pointer
1.2.12 对select的options集合操作
枚举元素除了[]外，SelectName.options.item()也是可以的, 另外SelectName.options.length, SelectName.options.add/remove都可以在两种浏览器上使用。注意在add后赋值元素，否则会失败。
参考知识库
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：190781次
排名：千里之外
原创：23篇
(1)(1)(1)(1)(2)(4)(2)(1)(1)(1)(1)(2)(14)未注册过用户可以点击直接登录哦！
使用注册邮箱登录
选择画板...
你已经成功采集到
&|关闭窗口如何嵌入到HTML？_krpano吧_百度贴吧
&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&&签到排名：今日本吧第个签到，本吧因你更精彩，明天继续来努力！
本吧签到人数：0可签7级以上的吧50个
本月漏签0次！成为超级会员，赠送8张补签卡连续签到：天&&累计签到：天超级会员单次开通12个月以上，赠送连续签到卡3张
关注：604贴子：
如何嵌入到HTML？
嵌入到HTML版本1.19为将krpano查看器嵌入到HTML页面embedpano.js需要使用脚本。这个脚本做许多重要的自动检测和设置的东西,如设备/系统功能检测(Flash或HTML5)并自动修复很多浏览器和系统相关问题和局限性(鼠标滚轮的使用)。这使得嵌入krpano查看器容易和简单的——一个脚本包含一行嵌入代码就足够了。文档主题:embedpano的功能。 js脚本脚本包括查看器嵌入嵌入参数启动/嵌入变量查看器删除指出了使用移动设备上(iPhone、iPad、Android)例子embedpano的功能。 js脚本创建并将krpano查看器嵌入到HTML页面。自动检查闪光或HTML5支持和自动加载适当的krpano查看器。几个浏览器,跨系统鼠标滚轮修复(wheel-zooming page-scrolling Mac支持,触摸板/ continues-wheel支持,车轮速度标准化)。当使用固定的几个Flashplayer限制窗口模式=透明或不透明。自动启用flash播放器的使用全屏模式。脚本也可以合并一起krpano HTML5浏览器脚本集成到一个脚本文件(例如“tour.js”)。当使用krpano帕诺人或使VTOUR滴这将是默认自动完成。脚本包括嵌入脚本需要包含在html页面的任何地方。包括它只是这样:&script src=&embedpano.js&&&/script&当一个脚本文件将使用HTML5嵌入式查看器,就包括这个文件:&script src=&tour.js&&&/script&查看器嵌入创建html页面上的任何地方& div &观众应该嵌入元素,给它一个独特的id通过css样式名称和定义它的大小:&div id=&pano& style=&width:100%; height:100%;&&&/div&在定义了& div &元素,创建一个&脚本&元素嵌入脚本代码。的embedpano.js脚本提供了一个embedpano()查看器嵌入函数:embedpano({...embedding parameters...});embedpano()函数需要的对象嵌入参数。完整的例子:&script src=&embedpano.js&&&/script&&div id=&pano& style=&width:600 height:400&&&/div&&script&
embedpano({swf:&krpano.swf&, xml:&pano.xml&, target:&pano&});&/script&嵌入参数embedpano()函数只需要一个Javascript对象作为参数。这个对象是用来传递所有参数(随机)通过使用parametername:价值对。(除了几乎所有的参数目标参数)是可选的,当他们没有定义,将使用默认值。的参数对象提供了以下设置:swf:&krpano.swf&名称和路径查看器”。 swf文件(相对于html文件)。默认值是“krpano.swf”。js:&krpano.js&名称和路径krpano HTML5浏览器”。 js文件(相对于html文件)。默认情况下相同的路径和文件名设置的基础主权财富基金设置将被使用,只是与“。 js的扩展,而不是. swf。这个设置将被忽略当HTML5浏览器嵌入到嵌入脚本文件。xml:&krpano.xml&启动xml文件名称和路径(相对于html文件)。默认名称相同的基本文件名的swf文件将使用(例如krpano。 xml krpano.swf)。target:&...pano-div-id...&浏览器的html元素的id应该嵌入。将会有一个“警报() 当没有目标的错误。id:&krpanoSWFObject&内部观察者对象的id。这将是观众通过连接的对象javascript接口。默认id“krpanoSWFObject”。重要的是,每个观众都有一个惟一的id !当已经存在一个对象具有给定id,然后嵌入脚本将自动添加数字id,直到年底是独一无二的。bgcolor:&#000000&观众的背景颜色(颜色在html格式)。默认值是“000000 #”(=黑)。wmode:&...&设置flash播放器窗口模式 设置。可能的设置:窗口——flash播放器默认情况下,系统支持和性能之间的妥协。注意:在许多系统和浏览器,html元素不能重叠的flash播放器模式!看到这窗口模式链接的细节。不透明的——允许其他html元素重叠Flashplayer(慢的渲染性能)。透明的——使flash播放器背景透明,允许看到html元素flash播放器后面,此外还允许其他html元素重叠flash播放器(更慢的渲染性能)。直接——最佳性能,硬件加速表示,没有html重叠在许多系统和浏览器(这通常是最快的方式,但在不兼容或旧系统/浏览器这可能会导致经济放缓)。krpano将使用窗口模式=直接默认情况下,除了铬-窗口模式=窗口将使用默认(窗口大小调整期间更好的性能和黑色)。HTML5指出:窗口模式通常是一个Flash-only设置,但窗口模式=透明也将评估krpano HTML5的观众,使背景透明的。 在HTML5浏览器重叠本身总是可能的。html5:&auto&设置krpano HTML5浏览器使用。可能的设置:汽车——默认设置自动使用HTML5 krpano查看器。设置,krpano Flash查看器将使用默认桌面和krpano HTML5观众只有当Flashplayer不可用或者当手机/平板电脑将被使用。更喜欢——喜欢krpano HTML5查看器的使用。设置,krpano HTML5查看器将使用默认情况下,和krpano Flash查看器只有当系统/浏览器不是方能尽享。回退——喜欢krpano Flash查看器的使用。使用krpano HTML5浏览器后退闪时不可用。只有——只使用HTML5 krpano查看器——从不使用krpano Flash查看器。设置,krpano HTML5查看器将在可能的情况下使用。当系统/浏览器不是方能尽享,那么将显示一条错误消息。总是总是使用HTML5 krpano查看器,无论系统/浏览器是否支持它。警告——这个设置应该只用于内部测试!从来没有——从不使用HTML5 krpano查看器,强制使用krpano Flash观众。设置为HTML5浏览器扩展:(测试)的html5设置可以扩展“webgl”或“css3d”来定义哪些绘制技术时应优先都可用。使用例子:html5 =“汽车+ css3d”,html5 = &喜欢+ webgl”,……当可用默认WebGL将首选。flash:&&设置krpano Flash浏览器使用。这是一个基本一样html5设置,逆。它可以用于更好的url,例如通过使用flash =喜欢而不是html5 =后退。当闪光设置将被设置,它将映射到一个html5设置和覆盖它。可能的设置:没有设置,使用html5设置。汽车- - - - - -一样html5 =汽车。更喜欢——喜欢krpano Flash查看器的使用。使用HTML5 krpano观众只有当没有flash播放器和系统/浏览器方能尽享。这个设置将映射到html5 =后退。回退——喜欢krpano HTML5查看器的使用。使用krpano Flash观众只是后备当HTML5是不可用的。这个设置将映射到html5 =喜欢。只有——只使用krpano Flash查看器——从不使用krpano HTML5查看器。设置,krpano Flash查看器将在可能的情况下使用。当没有flash播放器,那么将显示一条错误消息。这个设置将映射到html5 =没有。从来没有——从不使用krpano Flash浏览器,只使用krpano Flash查看器。这个设置将映射到html5 =只。vars:{...}通过与krpano Javascript对象变量:值对。这可用于设置krpano启动变量并设置任何其他krpano变量或设置。将被设置的变量后xml文件加载和解析。所以这些变量可以用来添加新设置或覆盖设置已经在xml中定义的。例子:var settings = {};settings[&onstart&] = &trace('on start...')&;settings[&view.hlookat&] = 30;embedpano({xml:&pano.xml&, target:&pano&, vars:settings});initvars:{...}通过与krpano Javascript对象变量:值对。这基本上是一样的增值设置,但是这些变量将被设置之前xml文件将被加载和解析。的主要使用此设置将变量可以设置自定义路径作为占位符里面url路径在xml文件中和/或设置变量,可以使用xml-if-checks为&包括&元素。例子:embedpano({..., initvars:{mypath:&./panos1/&} });XML:url=&%$mypath%image.jpg&能够通过initvars变量通过http查询直接在html文件的url语法需要使用:tour.html?initvars.variable=valuebasepath:...设置一个自定义的基本路径解决路径相对于krpano swf文件。可用于Flash和HTML5调整相对路径的xml。consolelog:false一个布尔设置定义如果krpano日志/跟踪消息应该发送到浏览器的Javascript控制台。mwheel:true一个布尔设置来控制鼠标滚轮的使用。当设置为真正的(默认),那么可以使用鼠标滚轮事件将被捕获并查看器(例如缩放)。当设置为假,那么任何鼠标滚轮的使用将被忽略,浏览器将其默认鼠标滚轮处理(通常是滚动网页)。mobilescale:0.5默认情况下所有krpano内容0.5将扩大在移动设备上。禁用扩展,设置mobilescale设置为1.0。这可以用于实现响应设计。参见xmlstagescale设置。fakedevice:&&假的krpano设备检测设置。可以设置:“移动”,“平板电脑”,“桌面”。注意:这个设置应该仅用于内部测试,从未发布!onready:...Javascript-Function...的onready设置可用于设置call-back-function完成通知当嵌入和krpano查看器准备使用。给定的函数将被调用krpano javascript接口对象。例子:embedpano({target:&krpanoDIV&, onready:krpanoReady});function krpanoReady(krpano){
krpano.call(&trace(krpano is ready...)&);}Flashplayer指出:这个函数需要的外部接口flash播放器!这意味着回调将本地离线工作/只有当flash播放器的安全设置进行调整。在这里看到更多detatils -本地/离线使用。onerror:...Javascript-Function...的onerror设置可用于设置一个自定义embedding-error-handling功能。给定的函数将调用一个错误消息字符串作为参数。passQueryParameters:false一个布尔值设置。 当设置为真正的从html url,所有查询参数作为变量传递给观众。当启用时,它也可以通过html5,闪光,窗口模式,mobilescale,fakedevice和initvars设置直接在html的url。使用的例子:tour.html?html5=only&startscene=scene2&initvars.design=flat启动/嵌入变量有一些特殊的变量,它可以使用嵌入观众。 这些变量并不会直接传递给观众,他们有一个嵌入本身特殊的意义:
xml与xml变量可以指定路径/名称启动的xml文件。当没有xml变量将将使用“默认加载”,试图加载一个xml文件具有相同的“:”swf文件(例如krpano.swf⇒krpano。 xml或pano.swf⇒pano.xml或tour.swf⇒之旅。 xml等等……)。simulatedevice这个变量允许测试iPhone / iPad /安卓桌面布局和图片。可能的设置:iphone-模拟iPhone / iPodipad——模拟iPaduseragent——模拟设备根据用户代理androidmobile模拟一个Android的移动设备(Flash)安卓或androidtablet模拟一个Android平板电脑(Flash)的krpano iPhone / iPad模拟器(包括在查看器中下载包)一起使用,设置一个iPhone / iPad的背景和一个原始大小的观察窗。查看器删除为消除帕诺人观众从html页面removepano()函数需要使用!removepano()函数将删除所有内部附加mouse-fixes(Flash)和所有DOM元素和事件(HTML5)。removepano(id);removepano()函数需要调用与独特id查看器的对象。例子:embedpano({target:&panoDIV&, id:&pano1&});...removepano(&pano1&);指出在移动设备上使用(iPhone、iPad、Android…)有一些设置可用的html文件,应该得到尊重,当试图让所有设备优化结果:总是使用HMTL5 doctype html文件:&!DOCTYPE html&正确的1:1 pixel-mapped显示,任何类型的自动页面/视窗扩展应该禁用。这可以通过使用&元&视窗设置html &头&元素:&meta name=&viewport& content=&target-densitydpi=device-dpi, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no& /&注:“target-densitydpi = device-dpi”设置是只知道Android和可能导致一个警告在其他浏览器(iOS,Chrome,…)在Javascript控制台——在这种情况下可以忽略这个警告。不要使用& iframe &元素包括观众——总是包括观众直接在页面上。当使用iframes iframe内的页面/窗口缩放不能控制和元素可以出现在一个错误的大小。扩展可以发生在这种情况下,还会影响显示质量。例子1。 最简单的用法:&script& embedpano({target:&pano&}); &/script&这里将使用所有缺省值:“krpano。 主权财富基金”的名字flash文件查看器,“krpano。 xml”作为默认的xml文件,“krpanoSWFObject“观众id和100%的大小。只有帕诺人的目标应该是嵌入式必须设置。2。 简单使用但更多的设置:&script&
embedpano({swf:&pano.swf&, xml:&pano.xml&, target:&pano&});&/script&这里的路径将swf和xml文件。3。 喜欢HTML5查看器:&script&
embedpano({swf:&pano.swf&, xml:&pano.xml&, target:&pano&, html5:&prefer&});&/script&4。 设置不透明的窗口模式设置:&script&
embedpano({swf:&pano.swf&, xml:&pano.xml&, target:&pano&, wmode:&opaque&});&/script&5。 选择性使用HTML5——喜欢只在Android和HTML5 IE10触摸设备上:&script&
function selecthtml5usage()
// check for Android:
if( navigator.userAgent.indexOf(&Android&) &= 0 )
return &prefer&
// check for IE10 with multi-touch display:
if( (navigator.msMaxTouchPoints|0) & 1 )
return &prefer&
// for all other cases use html5=auto:
return &auto&;
embedpano({xml:&pano.xml&, target:&pano&, html5:selecthtml5usage()});&/script&
打造完美办公生活，尽在优鸿装饰设计~
不是程序员还真的看不懂啊，我只是想知道怎么怎么嵌入到HTML而已
楼主，这种垃圾机翻还是别帖了，直接上原版更容易看懂，别把人带歪了~
贴吧热议榜
使用签名档&&
保存至快速回贴}