1

http://jsfiddle.net/GGsEt/3/

ファイアフォックスで動作

HTML

<ul>
    <li class="lib_undefined">
       <span class="hidden_toggle">
           <a href="/">Test</a>
       </span>
    </li>
</ul>
​

CSS

.hidden_toggle{
    text-align: center;
    font-size: 20px;
    font-weight: 600;
    color: #999;
    line-height: 80px;
    display: none;
}
    .hidden_toggle a{
        color: #999;
        border: none;
        display: block;
        width: 100%;    
        height: 90px;
    }

.lib_undefined{
    min-height: 90px;
    border: 1px solid #000;
}

jQuery

$('.lib_undefined').hover(function(){
     $(this).children('.hidden_toggle').fadeToggle();
});​

既知の修正はありますか? タグはali 全体を埋める必要があるため、表示がブロックに設定されています。

4

2 に答える 2

3

機能すると、フェード要素fadeToggle()に追加されました。/display: inline CSSなどのブロック要素を使用して、.divpa

使うだけ

display: inline-block.hidden_toggle a問題が解決することを願っています。

すなわち。

.hidden_toggle a {
    color: #999;
    border: none;
    display: inline-block; // change here
    width: 100%;    
    height: 90px;
}

デモ

ノート

ただしdisplay: inline-block、古い IE バージョンでは失敗します。

于 2012-06-25T03:04:41.660 に答える
1

問題は、fadeToggle（）関数の実装方法にあります。span-elementに適用すると、トグルインの最終結果として要素スタイルでdisplay：inlineが使用されます。これは必要なことではありません。

どこでも機能するように、HTMLコードで<span/>を<div/>に変更します：http： //jsfiddle.net/GGsEt/3/

セマンティック上の理由でスパンが必須である場合、animate（）を使用する以外の方法はありません。

于 2012-06-25T03:45:05.313 に答える