Mintik posted
4 year ago

AddClear.js

addclear
Çok fazla popüler olmasa da birçok popüler web sitesi tarafından kullanılan bir tane özellik. Form örneklerinde bulunan input alanlarına yazmaya başladığınız andan itibaren sağ tarafta bir tane çarpı işaret çıkar. Bu çarpı işaretinin amacı yazıyı tek seferde silmektir. Stephen Korecky tarafından yapılmış olan AddClear.js ile tasarladığınız form örneklerindeki input alanlarına çarpı işareti ekleyerek kullanıcıların tek seferde bütün yazıyı silmesini sağlayabilirsiniz. Olmazsa olmaz araçlardan olmasa bile arşivinizden eksik etmemeniz gereken bir tane çalışmadır diyebilirim. 

Kullanım

  • Head etiketleri arasına eklenmesi gereken bölümler.

Js dosya adresleri

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript" src="addclear.js"></script>

javaScript :

	<script type="text/javascript" charset="utf-8">
	  $(document).ready(function(){
	    $("input").addClear();
	  });
	</script>

Stil :

	<style type="text/css" media="screen">

	body {
	  font:normal 12px/1.5 "Helvetica Neue", Helvetica, sans-serif;
	}

	 #wrapper {
	   margin:100px auto 0;
	   width:300px;
	 }

	 #wrapper h1 {
	   font-size:18px;
	 }

	 #wrapper #search {
	   background:#EEE;
 	   -moz-border-radius: 5px;
 	   -webkit-border-radius: 5px;
 	   font-weight:bold;
 	   padding:10px;
 	 }

	 #wrapper #search label {
	   font-weight:bold;
	   margin:0 5px;
	 }

	 #wrapper #search input {
	   width:200px;
	 }

	 #wrapper #search span.note {
	   font-size:10px;
	   font-weight:normal;
	 }
	</style>
  • Body  etketleri arasına eklemeniz gereken bölüm.

Html :

<div id="wrapper">
	<p id="search"><label for="search_input">Search</label>
      <input type="text" name="search" value="" id="search_input">
</div>
Mintik is curious about your thoughts. Add a comment
Did you know that members who log in don't see ads?
Sign in with E-mail