悬浮层在谷歌下不能position:fixed;问题

今天做个功能是：页面上有三个悬浮层，两个自定义的悬浮层，一个外连接的客服连接的代码，（我这里的客服连接的代码是乐语公司的）

一开始测试在，火狐，IE，浏览器下测试都是显示正常的，唯独在谷歌浏览器下显示不正常，然后，我把客服连接的代码去掉后，我自定义的两个悬浮层就能显示正常了，

但是这就不符合要求了，没有客服连接的代码怎么办？然后我找了好久，position:fixed;在谷歌浏览器下显示正常，然后加入-webkit-transform:translateZ(0px);就显示正常了

-ms-transform:rotate(7deg);                //-ms代表ie内核识别码
-moz-transform:rotate(7deg);              //-moz代表火狐内核识别码
-webkit-transform:rotate(7deg);          //-webkit代表谷歌内核识别码
-o-transform:rotate(7deg);                  //-o代表欧朋【opera】内核识别码
transform:rotate(7deg);                      //统一标识语句。。。最好这句话也写下去，符合w3c标准

那么translateZ是什么意思了？

我们看http://www.w3school.com.cn/css3/css3_2dtransform.asp

W3C上说的

translate() 方法

通过 translate() 方法，元素从其当前位置移动，根据给定的 left（x 坐标） 和 top（y 坐标） 位置参数：

div#div2
{
     transform:translate(50px,100px);
     -ms-transform:translate(50px,100px); /* IE 9 */
     -moz-transform:translate(50px,100px); /* Firefox */
     -webkit-transform:translate(50px,100px); /* Safari and Chrome */
     -o-transform:translate(50px,100px); /* Opera */
}

值 translate(50px,100px) 把元素从左侧移动 50 像素，从顶端移动 100 像素。

结论：translateZ(0px),就是z轴是0px

我们看浏览器的内核引擎，基本上是四分天下：

Trident: IE 以Trident 作为内核引擎;

Gecko: Firefox 是基于 Gecko 开发;

WebKit: Safari, Google Chrome,傲游3,猎豹浏览器,百度浏览器 opera浏览器 基于 Webkit 开发。

Presto: Opera的内核，但由于市场选择问题，主要应用在手机平台--Opera mini

注：2013年2月Opera宣布转向WebKit引擎

注：2013年4月Opera宣布放弃WEBKIT，跟随GOOGLE的新开发的blink引擎