Question

我有一个我正在研究的网站有一个问题，在Safari和Chrome上，下拉列表不会同时消失，并且文本在隐藏之前会暂停一瞬间。有没有人有这类问题的经验？

网站：http://fb1.229.myftpupload.com/

非常感谢任何可以帮助分享知识的CSS向导。

最好，安德鲁

<div id="headcontainer">
            <header class="group">
                    <div id="logo">
                        <a href="/index.php"><img src="http://fb1.229.myftpupload.com/wp-content/uploads/2014/06/newsm-logo.png" border="0" ></a>
                    </div>
                    <div id="navigation">
                        <div class="responsiveSelectContainer"><ul id="menu-main-menu-1" class="menu responsiveSelectFullMenu"><li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-1216"><a href="#">Genres</a>
        <ul class="sub-menu">
            <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1219"><a href="http://fb1.229.myftpupload.com/category/basscannon/">Basscannon &#8211; Dubstep / Trap</a></li>
            <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1217"><a href="http://fb1.229.myftpupload.com/category/groove/">Groove &#8211; Disco / Deep House</a></li>
            <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1218"><a href="http://fb1.229.myftpupload.com/category/mainstage/">Mainstage &#8211; Electro / Prog House</a></li>
            <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1224"><a href="http://fb1.229.myftpupload.com/category/make-it-clap-traptwerkmoombah/">Make it Clap &#8211; Trap/Twerk/Moombah</a></li>
            <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1220"><a href="http://fb1.229.myftpupload.com/category/trance-tent/">Trance Tent &#8211; Trance</a></li>
            <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1221"><a href="http://fb1.229.myftpupload.com/category/ratchet-room/">Ratchet Room &#8211; Hip Hop</a></li>
            <li class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-1225"><a href="http://fb1.229.myftpupload.com/category/the-warehouse-techno/">The Warehouse &#8211; Techno</a></li>
        </ul>
        </li>
        <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-79"><a href="http://fb1.229.myftpupload.com/features/">Features</a></li>
        <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-81"><a href="http://fb1.229.myftpupload.com/mixes-live-sets/">Mixes &#038; Live Sets</a></li>
        <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-76"><a href="http://fb1.229.myftpupload.com/bab-top-shelf/">BAB Top Shelf</a></li>
        </ul><select class="responsiveMenuSelect"><option value="" selected="selected">Primary Menu</option>    <option  id="menu-item-1219" value="http://fb1.229.myftpupload.com/category/basscannon/">– Basscannon &#8211; Dubstep / Trap</option>
            <option  id="menu-item-1217" value="http://fb1.229.myftpupload.com/category/groove/">– Groove &#8211; Disco / Deep House</option>
            <option  id="menu-item-1218" value="http://fb1.229.myftpupload.com/category/mainstage/">– Mainstage &#8211; Electro / Prog House</option>
            <option  id="menu-item-1224" value="http://fb1.229.myftpupload.com/category/make-it-clap-traptwerkmoombah/">– Make it Clap &#8211; Trap/Twerk/Moombah</option>
            <option  id="menu-item-1220" value="http://fb1.229.myftpupload.com/category/trance-tent/">– Trance Tent &#8211; Trance</option>
            <option  id="menu-item-1221" value="http://fb1.229.myftpupload.com/category/ratchet-room/">– Ratchet Room &#8211; Hip Hop</option>
            <option  id="menu-item-1225" value="http://fb1.229.myftpupload.com/category/the-warehouse-techno/">– The Warehouse &#8211; Techno</option>
        <option  id="menu-item-79" value="http://fb1.229.myftpupload.com/features/">Features</option>
        <option  id="menu-item-81" value="http://fb1.229.myftpupload.com/mixes-live-sets/">Mixes &#038; Live Sets</option>
        <option  id="menu-item-76" value="http://fb1.229.myftpupload.com/bab-top-shelf/">BAB Top Shelf</option>
        </select></div>         </div>
                    <div id="navigation-right">
                        <div class="menu-secondary-container"><ul id="menu-secondary" class="menu"><li id="menu-item-83" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-83"><a href="http://fb1.229.myftpupload.com/about-us/">About Us</a></li>
        <li id="menu-item-82" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-82"><a href="http://fb1.229.myftpupload.com/contact-us/">Contact Us</a></li>
        </ul></div>         </div>
            </header>
            </div>

这是HTML的样本，CSS位于

之下

            ul.menu,
            ul.menu li,
            ul.menu ul {
             list-style: none;
             margin: 0;
             padding: 0;
            }

            ul.menu {
             position: relative;
             z-index: 597;
             float: left;
            }

            ul.menu li {
             float: left;
             line-height: 1.3em;
             vertical-align: middle;
             zoom: 1;




            }

            ul.menu li.hover,
            ul.menu li:hover {
             position: relative;
             z-index: 599;
             cursor: default;
            }

            ul.menu ul {
             visibility: hidden;
             position: absolute;
             top: 100%;
             left: 0;
             z-index: 598;
             width: 100%;


            }


            ul.menu ul li {
             float: none;
            }

            ul.menu ul ul {
             top: 1px;
             left: 99%;
            }

            ul.menu li:hover > ul {
             visibility: visible;
            }

Answer 1

这是因为你有一个转换集。您可以删除它，然后它将同步。

ul.menu, ul.menu li, ul.menu ul {
-webkit-transition: none;
-moz-transition: none;
-o-transition: none;
transition: none;
}

下拉菜单 - Safar和Chrome中的问题，非常奇怪

1 个答案: