0
我有一個簡單的多層（3）UL> LI導航，其中包含一些JS和CSS。一切正常。在我將YouTube視頻iFrame添加到頁面之前，在加載/重新加載頁面時鏈接消失，然後再次加載它們。大多數情況下，它們不可見，在IE，FF，Edge，Safari和Opera上都可以正常工作，它只是Google Chrome（PC Win 10，所有最新版本的瀏覽器）。在網頁上嵌入YouTube iFrame導致UL LI導航中的鏈接消失
我已經嘗試通過jQuery在所有元素加載頁面後添加CSS樣式，添加隨機元素，將html標籤更改爲某些東西然後再回來，甚至嘗試使用GSAP動畫文本和背景的顏色動畫但沒有強制重置CSS。我觀看了鉻代碼檢查器中的字體（顏色RGBA）值補間，並且沒有任何內容。如果我檢查頁面，所有的代碼都是完美的。
目前這是在開發服務器上，所以無法提供主動預覽。
唯一的辦法是刪除所有的CSS或IFRAME。
其他人有什麼想法？
其他 使用viemo iFrame進行測試並且所有功能都已恢復，所以youtube iframe是問題所在。 的iFrame代碼：iframe的
if ($article["youtube_header"] != "" && $article["youtube_header"] != null){
//echo('<iframe width="100%" height="400" src="https://www.youtube.com/embed/' . $article["youtube_header"] . '?wmode=transparent&rel=0" frameborder="0" allowfullscreen></iframe>');
}
HTML
<iframe width="100%" height="400" src="https://www.youtube.com/embed/9SvpZ1OkvdE?wmode=transparent&rel=0" frameborder="0" allowfullscreen></iframe>
HTML渲染資產淨值：
<div id="aftc-nav">
<div class="nav-top">Menu</div>
<ul id='navulFsQTke4' data-tier='1' class='nav-ul-tier-1'>
<li><a href='/Dev/AFTC/AFTC_2016/www/category/cat-1-url' data-nid='166' data-pid='' data-cid='54' data-url='cat-1-url' class='nav-a-tier-1' nav-first-a'>cat1</a></li>
<li><a href='#' data-nid='167' data-pid='' class='nav-a-tier-1 nav-parent'>cat2</a>
<ul id='navulEmODx6F' data-tier='2' class='nav-ul-tier-2'>
<li><a href='/Dev/AFTC/AFTC_2016/www/article/art-2' data-nid='168' data-pid='167' data-aid='29' data-url='art-2' class='nav-a-tier-2'>art 2</a></li>
<li><a href='/Dev/AFTC/AFTC_2016/www/article/art-1' data-nid='174' data-pid='167' data-aid='28' data-url='art-1' class='nav-a-tier-2'>art 1</a></li>
</ul>
</li>
</ul>
<div class="nav-btm"></div>
</div>
CSS/LESS
#aftc-nav {
}
#aftc-nav ul {
margin: 0;
padding: 0;
list-style: none;
overflow: hidden;
}
#aftc-nav ul li {
display: block;
margin: 0;
padding: 0;
list-style: none;
cursor: pointer;
}
#aftc-nav .nav-top {
display: block;
padding: 4px;
font-family: "Roboto", Helvetica, Arial, sans-serif;
font-size: 16px;
font-weight: bold;
background: #333333;
color: #FFFFFF;
.roundTop;
border-bottom: 1px solid #000000;
}
#aftc-nav .nav-btm {
display: block;
height: 30px;
background: #333333;
.roundBtm;
border-top: 1px solid #000000;
}
#aftc-nav .nav-first-a {
}
#aftc-nav a {
display: block;
font-family: "Roboto", Helvetica, Arial, sans-serif;
font-size: 14px;
color: #FFFFFF;
text-decoration: none;
border-bottom: 1px solid #000000;
font-weight: normal;
}
#aftc-nav a:Hover {
}
#aftc-nav a:visited {
color: #FFFFFF;
}
#aftc-nav a:active {
color: #FFFFFF;
}
#aftc-nav a:link {
color: #FFFFFF;
}
#aftc-nav .nav-parent {
font-size: 15px;
font-weight: bold;
}
#aftc-nav .selected {
background: #660000 !important;
}
#aftc-nav .selected:Hover {
background: #990000 !important;
}
#aftc-nav .nav-a-tier-1 {
padding: 3px 3px 3px 5px;
background: #666666;
color: #FFFFFF;
}
#aftc-nav .nav-a-tier-1:hover {
background: #990000;
}
#aftc-nav .nav-a-tier-2 {
padding: 3px 3px 3px 15px;
background: #444444;
color: #FFFFFF;
}
#aftc-nav .nav-a-tier-2:hover {
background: #990000;
}
#aftc-nav .nav-a-tier-3 {
padding: 3px 3px 3px 25px;
background: #222222;
color: #FFFFFF;
}
#aftc-nav .nav-a-tier-3:hover {
background: #990000;
}
想法？
感謝
d
你可以發佈你的相對CSS和iframe的相關代碼，包括你的UL和LI –
我已經用代碼更新了主要問題。 iFrame和DIV UL LI（導航）位於網站的不同區域。 2列CSS佈局左固定，流暢的權利。 – Darcey