z-index设置说明

z-index设置说明
z-index越大越在上面
设置最顶层显示z-index:999999;position:relative;float: right;

层叠准则
1谁大谁上：在同以层叠上下文领域，层叠水平值(z-index值)大的在上面。
2 后来居上：当元素的层叠水平一致、层叠顺序相同时，在DOM流中处于后面的元素会覆盖前面的元素。
3 层叠上下文可以嵌套，内部层叠上下文及其所有子元素均受制于外部的层叠上下文。
4每个层叠上下文和兄弟元素独立，当进行层叠变化或渲染时，只需要考虑后代元素。
5对于position: relative / absolute以及Firefox/IE下含有position:fixed声明的定位元素，当其z-index值不为auto的时候，会创建层叠上下文。（具体实例参考下方链接2）
6 z-index 负值的作用：

• 可访问性隐藏，只需在层叠上下文内的某一个父元素加个背景色即可。
• 多背景模拟。
• 定位在元素的后面。

例子如下所示：

<div style="z-index:999999;"><input type="button" value="全屏" style="position:relative;float: right; background-color: powderblue; z-index:999998;" id="fullScreen">
    <input id="fwidth" type="hidden" />
    <input id="fheight" type="hidden" />
    </div>

js单击事件

var fs_flag = false;
var fwidth = "";
var fheight = "";
//全屏功能
$("#fullScreen").click(function () {
    //兼容谷歌
    if (!fs_flag & $("#fullScreen").val() == "全屏" && document.documentElement.webkitRequestFullscreen) {
        document.documentElement.webkitRequestFullscreen();
        $("#fullScreen").prop("value", "还原");
        $("#fwidth").val(window.screen.width);//调整为屏幕大小
        $("#fheight").val(window.screen.height);
    }
    if (fs_flag & $("#fullScreen").val() == "还原" && document.webkitExitFullscreen) {
        document.webkitExitFullscreen();
        $("#fullScreen").prop("value", "全屏");

        $("#fwidth").val(hwidth);//还原回初始大小
        $("#fheight").val(hheight);
    }
    fs_flag = !fs_flag;
    //
    if (cform && cform.GetFormObj().JsForm.BackGround) {
        $("html").css("background-size", $("#fwidth").val() + "px    " + $("#fheight").val() + "px");
    }
});