<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript">
(function($){$.fn.overlabel=function(options){var opts=$.extend({},$.fn.overlabel.defaults,options);var selection=this.filter('label[for]').map(function(){var label=$(this);var id=label.attr('for');var field=document.getElementById(id);if(!field)return;if(label.hasClass('cms-overlabel-active')==false){var o=$.meta?$.extend({},opts,label.data()):opts;label.addClass(o.label_class).addClass('cms-overlabel-active');var hide_label=function(){label.hide();label.data('shown',0);};var show_label=function(){if(!this.value&&label.data('shown')!=1){label.fadeIn('fast');label.data('shown',1);}else if(this.value&&label.data('shown')==1){label.hide();label.data('shown',0);}};var p=$(field).position();var h=parseInt($(field).height().toString().replace('px',''),10);var fsRaw=$(field).css('font-size');var fs=parseInt(fsRaw.replace('px',''),10);if(fs>h){fsRaw=$(field).parent().css('font-size');}
label.css({'top':p.top+'px','left':p.left+'px','padding-top':parseInt($(field).css("padding-top"))+'px','padding-left':(parseInt($(field).css("padding-left"))+2)+'px','font-family':$(field).css("font-family"),'font-size':fsRaw});$(field).focus(hide_label).blur(show_label).change(show_label).each(hide_label).each(show_label);}
return this;});return opts.filter?selection:selection.end();};$.fn.overlabel.defaults={label_class:'cms-label-dynamic',hide_css:{'text-indent':'-10000px'},show_css:{'text-indent':'0px','cursor':'text'},filter:false};})(jQuery);
</script>
</head>
<body>
<div class="cms-label-watermark-wrap">
<label for="first_name" class="cms-label-watermark">First Name</label>
<input class="" type="text" size="30" name="first_name" id="first_name" value="" />
</div>
<script type="text/javascript">
$(document).ready(function(){
$('label.cms-label-watermark').overlabel();
});
</script>
</body>
</html>
No comments:
Post a Comment