CSS实现提示框的效果

IE和firefox的dom模型重要的两点差别：

• 使用attr方法来获取属性的时候，IE中的属性节点比firefox多了很多没有定义的节点。
• 文本节点的数量和内容也不一样，有些换行和空格等无意义的东西IE并不会显示，而firefox则会将这些信息保留下来。

doucument在dom中的地位

• document属根节点，是一个虚幻的内容，而html节点是根元素节点，是一个实际的东西。

CSS实现提示框的效果

html页面

    <a onclick="showwin()" href="#">显示浮动窗口</a>    <div id="win">        <div id="title">            标题栏            <span id="close" onclick="hide()">X</span>        </div>        <div id="content">            内容栏        </div>    </div>

css页面

#win { /*窗口有边框*/    border: 1px red solid;    width: 300px;    height: 200px;    position: absolute;    top: 100px;    left: 200px;    /**    刚上来不显示    **/    display: none;}#title {    background-color: blue;    /**文字属性**/    color: yellow;    padding-left: 3px;}#content {    padding-top: 5px;    padding-left: 3px;}#close {    margin-left: 230px;    /**实现小手让用户知道有关闭功能**/    cursor:pointer;}

js代码：

function showwin(){    //三种方式实现打开效果    var winDom=$("#win");    //1.JQUERY修改css    //winDom.css("display","block");    //2.Jquery的show方法    //winDom.show("slow");    //淡入淡出    winDom.fadeIn("slow");}function hide(){    //三种方式实现关闭效果    var winDom=$("#win");    //1.JQUERY修改css    //winDom.css("display","none");    //2.Jquery的show方法    //winDom.hide("slow");    //淡入淡出    winDom.fadeOut("slow");}