1997
Áèáëèîòåêà JAVASCRIPT SE@RCHER
Áèáëèîòåêà JAVASCRIPT SE@RCHER
Áèáëèîòåêà JAVASCRIPT SE@RCHER
Javascript + CSS
::
• áëîê
• òåêñò
• ëèíê
• ìåíþ
• ôîòî
• îêíî
• êíîïêà
• ôîí
• âèäåî
• òàáëèöà
âñòàâèòü HTML-êîä
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /> <title>Áèáëèîòåêà Javascript HTML5 Àòðèáóò placeholder Çàìåíà òåêñòà â textarea ïðè íàáîðå òåêñòà</title> <script type="text/javascript" src="https://www.03www.ru/jquery/jquery.min.js"></script> <script type="text/javascript"> /** Placeholder plugin for jQuery * Copyright 2010, Daniel Stocks (http://webcloud.se)*/ (function(b){function d(a){this.input=a;a.attr("type")=="password"&&this.handlePassword();b(a[0].form).submit(function(){if(a.hasClass("placeholder")&&a[0].value==a.attr("placeholder"))a[0].value=""})}d.prototype={show:function(a){if(this.input[0].value===""||a&&this.valueIsPlaceholder()){if(this.isPassword)try{this.input[0].setAttribute("type","text")}catch(b){this.input.before(this.fakePassword.show()).hide()}this.input.addClass("placeholder");this.input[0].value=this.input.attr("placeholder")}}, hide:function(){if(this.valueIsPlaceholder()&&this.input.hasClass("placeholder")&&(this.input.removeClass("placeholder"),this.input[0].value="",this.isPassword)){try{this.input[0].setAttribute("type","password")}catch(a){}this.input.show();this.input[0].focus()}},valueIsPlaceholder:function(){return this.input[0].value==this.input.attr("placeholder")},handlePassword:function(){var a=this.input;a.attr("realType","password");this.isPassword=!0;if(b.browser.msie&&a[0].outerHTML){var c=b(a[0].outerHTML.replace(/type=(['"])?password\1/gi, "type=$1text$1"));this.fakePassword=c.val(a.attr("placeholder")).addClass("placeholder").focus(function(){a.trigger("focus");b(this).hide()});b(a[0].form).submit(function(){c.remove();a.show()})}}};var e=!!("placeholder"in document.createElement("input"));b.fn.placeholder=function(){return e?this:this.each(function(){var a=b(this),c=new d(a);c.show(!0);a.focus(function(){c.hide()});a.blur(function(){c.show(!1)});b.browser.msie&&(b(window).load(function(){a.val()&&a.removeClass("placeholder");c.show(!0)}), a.focus(function(){if(this.value==""){var a=this.createTextRange();a.collapse(!0);a.moveStart("character",0);a.select()}}))})}})(jQuery); </script> <script type="text/javascript"> jQuery(function(){ jQuery('input[placeholder], textarea[placeholder]').placeholder(); }); </script> <style type="text/css"> form {margin: 20px;} form div {margin-bottom: 10px;} input, textarea{width:200px;} ::-webkit-input-placeholder {color: #999;font:14px Arial, "Helvetica CY", "Nimbus Sans L", sans-serif;} :-moz-placeholder {color: #999;font:14px Arial, "Helvetica CY", "Nimbus Sans L", sans-serif;} .placeholder {color: #999;font:14px Arial, "Helvetica CY", "Nimbus Sans L", sans-serif;} </style> </head> <body> <div class="main"> <form action="#" method="post"> <div> <input type="text" placeholder="Ëîãèí" name="username"> </div> <div> <input type="password" placeholder="Ïàðîëü" name="password"> </div> <div> <textarea placeholder="Ââåäèòå òåêñò" name="text"></textarea> </div> <div> <input type="submit" value="Îòïðàâèòü" /> </div> </form> </div> </body> </html>
ðåçóëüòàò
ïðîñìîòð
î÷èñòèòü âñå
ïåðåçàãðóçêà
îòä.îêíî
Áèáëèîòåêà JAVASCRIPT 1997- Äèçàéí è ñîïðîâîæäåíèå © SE@RCHER