让一个div淡出文本区域的焦点

-1

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

文本区域HTML

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

HTML的DIV我想淡出

<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; 
}

来源

2012-09-03 Francesca

究竟你不知道该怎么办？指定要使用哪个元素？处理点击元素？淡化元素了吗？ –

我试过使用我当前的淡入/淡出JavaScript用于网站的另一个区域（当用户滚动过去某个点时，会出现div）但我不知道如何去识别它当textarea作为开始JavaScript的事件焦点时。 – Francesca

@Mat - 我甚至不知道这是否可能，一开始，因此我的含糊查询。我已经使用了一些淡入淡出的JavaScript，但我不知道如何指定它来触发文本区域的焦点，如果这甚至是可能的话。 – Francesca

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

来源

2012-09-03 20:25:57

我试过这个，但似乎无法做到它可以工作。任何想法，我可能会出错？ www.jamesperrett.co.uk/testsite – Francesca

试试这个：

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

它结合两个事件到textarea的，一到focus事件，而一到blur事件。 http://jsfiddle.net/FzmW2/

如果您不希望它淡入，请删除.blur部件。

来源

2012-09-03 20:26:09 ThoKra

+1另外请注意，当单击textarea时不必处理点击事件，因为无论如何都会触发focus。 –

你能告诉我，是否需要将气泡div与textarea放在同一个div中？我无法正常工作。现场网站是www.jamesperrett.co.uk/testsite，可以在联系表单部分查看bubble/textarea。 – Francesca

我给你的代码是通过ID访问textarea和div，所以它们可以在文档中的任何位置。但是，当我使用Chrome对其进行测试时，它似乎确实起作用。 – ThoKra

让一个div淡出文本区域的焦点

回答

相关问题