Question

我有一个div，当点击/聚焦某个文本区域时，我希望使用JavaScript淡出。这可能吗？

文字区域HTML

<label for="message">Message:</label>
    <textarea name="message" id="message" wrap="physical" 
         placeholder="What's on your mind?">
    </textarea>

div的HTML我想淡出

<div id="bubble">
    <img src="images/hire_me_bubble.png" alt="Hire me" />
</div>

泡泡CSS

#bubble{
    width:201px;
    height:189px;
    position:absolute;
    left:416px; 
    top:300px; 
    z-index: 99;
    overflow:visible;
}

Answer 1

试试这个：

$("#message").focus(function() {
    $("#bubble").fadeOut();
}).blur(function() {
    $("#bubble").fadeIn();
});

它将两个事件绑定到textarea，一个绑定到focus事件，一个绑定到blur事件。 http://jsfiddle.net/FzmW2/

如果您不想让它淡入，请删除.blur部分。

Answer 2

$('#message').bind('focus', function(){
    $('#bubble').fadeOut();
 });

在文本区域的焦点上淡出div

2 个答案: