0

ワードプレスのページにアナウンスバーを追加しようとしています。バーを追加する方法は知っていますが、ユーザーがバーの「x」をクリックしたときにバーが消えることも望んでいます。

私がこれまでに持っているコード:

CSS

#message_box {
position: absolute;
top: 0; left: 0;
z-index: 10;
background:#ffc;
padding:5px;
border:1px solid #CCCCCC;
text-align:center;
font-weight:bold;
width:99%;
}

HTML

<div id="message_box">
    <img id="close_message" style="float:right;cursor:pointer" src="...." />
    TEXT HERE
</div>

ユーザーが「x」画像をクリックすると通知が消えるように、JSをWordPressに実装するにはどうすればよいですか?

4

2 に答える 2

1

jQueryをまだ使用していない場合は、純粋なJavascriptを使用できます。たった4行のコードでjQueryをロードするのは、少しやり過ぎです。

document.getElementById("close_message").onclick = function() {
    document.getElementById("message_box").style.display = 'none';
};
于 2012-12-19T02:34:47.560 に答える
0

簡単なjQuery関数を使用できます

$(function(){
    $('#close_message').click(function(){
        $('#message_box').remove();
    });
});

例: http://jsfiddle.net/qsfjC/

于 2012-12-19T02:16:25.660 に答える