0

だから、私はこのJavascriptを非表示-表示効果に使用します:

function effect(id) {
    var h = document.getElementById(id);
    h.style.display = ((h.style.display != 'none') ? 'none' : 'inline');
}

HTML:

<div class="div">
    <a href="#" onclick="effect('h');"><img src="http://i.imm.io/1jf2j.png"/></a>
    <a href="index.php" class="url" id="h">Home</a>
</div>

およびCSS:

.div {
    background: #000;
}
.div .url {
    font-size: 17px;
}

ここでコードをテスト (および編集) できます: http://codepen.io/anon/pen/dhHiw
JSFiddle は私には機能しません。

すべてが良いです。画像をクリックした場合を除きます。1px上に移動しました。別の画像を使用する必要がありますか?
問題はどこだ？そして可能な解決策。ありがとうございました！

4

1 に答える 1

3

基本的にテキスト要素を削除しています。には高さが設定されていないため、<div class="div">その中の要素に依存します。テキストが表示されていない場合 ( display=none)、div は画像のみにサイズ変更されます。

これは、div の高さを設定するか、visibility=hidden代わりにテキストを設定することで修正できますdisplay=none。非表示にすると、同じサイズのままですが、代わりに非表示になります。

于 2013-10-23T23:19:15.527 に答える