html - 主菜单中的 sIFR

Question

这是菜单吗:

<div class="navigation">
  <ul id="nav-menu">
    <li class="active">
      <div class="sifr-r active"><a href="#" title="home" class="top-link"><span class="blue-small">01.</span><br />HOME</a></div>
      <div class="blue-line"></div>
    </li>
    <li>
      <div class="sifr-r"><a href="#" title="property management" class="top-link"><span class="blue-small">02.</span><br />PROPERTY<br />MANAGEMENT</a></div>
      <div class="blue-line"></div>
      <ul>
        <li><a href="#" title="Rental returns">Rental returns</a></li>
        <li class="last"><a href="#" title="Resources">Resources</a></li>
      </ul>
    </li>
</ul>

和 sIFR:

sIFR.replace(conduititc_light, {
  selector: '.sifr-r',
  css: [
    'a {color: #3c4a4b; text-decoration: none; margin-left: 4}',
    'a .blue-small {color: #00bbd6; font-size: 8}',
    'a:hover {color: #ffffff}',
    'a:hover .blue-small {color: #00bbd6}',
    'a.hover {color: #ffffff}'
  ],
  wmode: 'transparent'
});

当鼠标指向 li 时，如何在 sIFR 中保存悬停效果？在没有 sIFR 的情况下，它是用 js (mootools) 制作的:

var nav = $('nav-menu');
nav.getElements('.sifr-r').each(function(item) {
  item.getParent().addEvents({
    'mouseover': function() {
      if (!item.getParent().hasClass('hover')) {
        item.getParent().addClass('hover');
      }
    },
    'mouseout': function() {
      if (item.getParent().hasClass('hover')) {
        item.removeClass('hover');
      }
    }
  });
});

和 CSS:

.navigation ul li.hover a.top-link {color: white}

Answer 1

您需要在 sIFR Flash 文件中创建悬停效果。 sIFR 将页面中的 HMTL 元素替换为 Flash SWF。此 SWF 完全不受 CSS 类的影响。