因为项目用滑动展示奖品的效果,晚上试着写了一下,结果JS很轻松但CSS遇到了问题

他的原理是用这个标准尺寸设置为relative属性的DIV去包含一个absolute属性的超宽DIV,然后利用LEFT去控制展示的位置

不过我写出来发现,那个超宽的DIV并没有像我所想象的那样隐藏起来,设置了overflow:hidden仍然不行,然后用无敌的CSS兼容除错代码还是不行,于是就纠结了,找来找去最后发现并不是给超宽的DIV加隐藏滚动条,因为这个DIV本来就不会出现滚动条,而是要给那个标准尺寸的DIV加,因为只有他才会出现滚动条,是我自己理解2了 哈哈

mio_lt;!DOCTYPE htmlmio_gt;
mio_lt;htmlmio_gt;
    mio_lt;headmio_gt;
        mio_lt;titlemio_gt;indexmio_lt;/titlemio_gt;
        mio_lt;stylemio_gt;
            * { margin:0; padding:0; word-break:break-all; }
            body { background:#FFF; color:#333; font:12px/1.5em Helvetica, Arial, sans-serif; }
            h1, h2, h3, h4, h5, h6 { font-size:1em; }
            a { color:#2B93D2; text-decoration:none; }
            a:hover { color:#E31E1C; text-decoration:underline; }
            ul, li { list-style:none; }
            fieldset, img { border:none; }
            .main{width:400px;height:200px;border:1px #F60 solid;position:relative;overflow:hidden;}
            .nav{width:3000px;height:200px;position:absolute;}
            .nav ul{float:left;list-style:none;}
            .nav li{float:left;list-style:none;width:200px;height:200px;background:#DDD;margin:0 10px 0 10px;}
        mio_lt;/stylemio_gt;
    mio_lt;/headmio_gt;
    mio_lt;bodymio_gt;
        mio_lt;div class="main"mio_gt;
            mio_lt;div class="nav"mio_gt;
                mio_lt;ulmio_gt;
                    mio_lt;limio_gt;1mio_lt;/limio_gt;
                    mio_lt;limio_gt;2mio_lt;/limio_gt;
                    mio_lt;limio_gt;3mio_lt;/limio_gt;
                    mio_lt;limio_gt;4mio_lt;/limio_gt;
                    mio_lt;limio_gt;5mio_lt;/limio_gt;
                mio_lt;/ulmio_gt;
            mio_lt;/divmio_gt;
        mio_lt;/divmio_gt;
    mio_lt;/bodymio_gt;
mio_lt;/htmlmio_gt;

上一篇:MovieClip类的一些属性 下一篇:快递查询API