Firefox不支持W3Schools幻灯片水平javascript

Question

http://www.w3schools.com/dhtml/tryit.asp?filename=trydhtml_menu_slidehorizontal可以在IE中正常工作，但是在Firefox中，如果我删除了它支持的doctype，则由于doctype而不受支持，请帮助我解决此兼容问题

HTML代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script type="text/javascript">
// scrit for slider start here
     var i = -320;
     var intHide;
     var speed = 10;
     function showmenu() {
         clearInterval(intHide);
         intShow = setInterval("show()", 10);
     }
     function hidemenu() {
         clearInterval(intShow);
         intHide = setInterval("hide()", 10);
     }
     function show() {
         if (i < -12) {
             i = i + speed;
             document.getElementById('myMenu').style.left = i;
         }
     }
     function hide() {
         if (i > -320) {
             i = i - speed;
             document.getElementById('myMenu').style.left = i;
         }
     }
</script>

<style type="text/css">
    div.Main
    {
        background-color: #f1f1f1;
    }
    div.Treemenu
    {
        background: #741918;
        height: auto;
        width: 323px;
    }
    div.Treenav
    {
        background: #741918;
        position: absolute;
        font: bold 80% arial;
        top: 0px;
        left: -320px;
        width: 350px;
        color: White;
        float: left;
    }
    div.collection
    {
        float: right;
        cursor: default;
        padding: 0;
        font-size: 16px;
        font-weight: bold;
        background-image: url( '/_layouts/images/B2E/Collection_Bg.png' );
        background-repeat: no-repeat;
        background-color: #741918;
        width: 27px;
        font-family: Calibri;
        padding: 5px 0 0 0;
    }
</style>

<div class="Main">
    <p>
        content content content content</p>
    <div id="myMenu" class="Treenav" onmouseover="showmenu()" onmouseout="hidemenu()">
        <div class="collection">
            <<br />
            C<br />
            O<br />
            L<br />
            L<br />
            E<br />
            C<br />
            T<br />
            I<br />
            O<br />
            N
        </div>
        <div class="Treemenu">
            <p>
                Treemenu Treemenu Treemenu Treemenu</p>
            <p>
                Treemenu Treemenu Treemenu Treemenu</p>
        </div>
    </div>
</div>

Answer 1

您的CSS设置left财产的Number ，但它只接受一个length和长度未0必须有单位（如： 27px ）。

Firefox不支持W3Schools幻灯片水平javascript

问题描述

1 个解决方案

解决方案1
1 已采纳 2011-12-10 09:54:19

Firefox不支持W3Schools幻灯片水平javascript

问题描述

1 个解决方案

解决方案1 1 已采纳 2011-12-10 09:54:19

解决方案1
1 已采纳 2011-12-10 09:54:19