1

私は初心者のWeb開発者であり、2つの画像を完全に重ね合わせたいと思っています。アプリケーションに入力された回答が正しいかどうかをチェックするアプリケーションを開発しています。回答ごとに、正解と不正解のそれぞれにチェックマークまたは「X」マークを表示します。これを行うには、CSSとJavaScriptを使用します。

CSS：

#checkmark { visibility: hidden}
#xmark {visibility:visible}

JavaScript：

function showCorrect(input, ans) {
    if (input == ans) {
        document.getElementById('checkmark').style.visibility=visible;
    }
}

これを行うには、チェックマークを表示して、xマークを完全に隠すようにします。チェックマークが「X」マークを覆うように、画像をどちらかの上に完全に重ねる最も簡単な方法は何ですか？

4

1 に答える 1

1

画像を重ねる方法：

.imagewrapper {
position:relative;}

.imagewrapper img {
position:absolute;
top:0px;
left:0px;
}

.img1 {
z-index:1
}
.img2 {
z-index:2;
}

HTML

<div class="imagewrapper">
<img class="img1" src="img1.jpg" />
<img class="img2" src="img2.jpg" />
</div>

これにより、画像が重なります。

Zindexは、どの画像を上に表示するかを制御します。

または、display：none;を使用することもできます。およびdisplay：block; jsで、またはz-indexを変更することもできます。

ディスプレイを使用する場合は、何もオーバーラップする必要はありません。

于 2013-01-20T14:34:12.793 に答える