Home > Developer > JavaScript
Simple implementation code of text box watermark prompts
This article mainly introduces the simple implementation code of text box watermark prompts. If you need some help, please refer to it.
The Code is as follows:
<! Doctype html>
<Html>
<Head>
<Title> </title>
<Script src = "http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type = "text/javascript"> </script>
<Style type = "text/css">
# DivTips {
Filter: alpha (opacity = 30);/* IE filter, with a transparency of 50% */
-Moz-opacity: 0.3;/* Private in Firefox, transparency: 50% */
Opacity: 0.3;/* others, with a transparency of 50% */
Position: absolute; width: 600px; height: 400px; display: none; color: red; z-index: 10; padding: 10px;
}
</Style>
<Script type = "text/javascript">
$ (Function (){
Var $ txtNote = $ ("# txtNote ");
Var $ divTips = $ ("# divTips ");
$ TxtNote. focus (function (){
// Hide when focusing
$ DivTips. hide ();
}). Blur (function (){
// When leaving, if it is empty, it will be displayed; otherwise, it will be hidden and positioned.
$ DivTips. toggle ($ txtNote. val () = "")
. Css ({
"Left": $ txtNote. position (). left,
"Top": $ txtNote. position (). top
});
});
$ DivTips. click (function (){
$ TxtNote. focus ();
});
$ TxtNote. blur ();
});
</Script>
</Head>
<Body>
Message Board <br/>
<Textarea id = "txtNote" style = "width: 600px; height: 400px;"> </textarea>
<Div id = "divTips">
Thank you! Please write down what you have to say !! <Br/>
(Leave your name in the box below. If it is convenient, leave your contact information)
</Div> <br/>
<Input type = "text" value = "name"/> <input type = "text" value = "mobile phone/QQ /...... "/>
</Body>
</Html>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
