我有一个我正在研究的网站有一个问题,在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 – 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 – 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 – 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 – 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 – 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 – 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 – 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 & 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 – Dubstep / Trap</option>
<option id="menu-item-1217" value="http://fb1.229.myftpupload.com/category/groove/">– Groove – Disco / Deep House</option>
<option id="menu-item-1218" value="http://fb1.229.myftpupload.com/category/mainstage/">– Mainstage – Electro / Prog House</option>
<option id="menu-item-1224" value="http://fb1.229.myftpupload.com/category/make-it-clap-traptwerkmoombah/">– Make it Clap – Trap/Twerk/Moombah</option>
<option id="menu-item-1220" value="http://fb1.229.myftpupload.com/category/trance-tent/">– Trance Tent – Trance</option>
<option id="menu-item-1221" value="http://fb1.229.myftpupload.com/category/ratchet-room/">– Ratchet Room – Hip Hop</option>
<option id="menu-item-1225" value="http://fb1.229.myftpupload.com/category/the-warehouse-techno/">– The Warehouse – 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 & 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;
}
答案 0 :(得分:1)
这是因为你有一个转换集。您可以删除它,然后它将同步。
ul.menu, ul.menu li, ul.menu ul {
-webkit-transition: none;
-moz-transition: none;
-o-transition: none;
transition: none;
}