تبیان، دستیار زندگی

شاید براتون پیش اومده باشه که در فرم هاتون از کاربر درخواست یک رنگ html رو میکنید و از اونجایی که شاید کاربر با کد html رنگ ها آشنا نباشه ، دوست دارید که یک باکس انتخاب رنگ برای اون قرار بدید ، تا به جای نوشتن کد رنگ ، خود رنگ رو انتخاب کنه و فیلد رنگ شما به صورت خودکار کد اون رنگ رو در بر بگیره !
:: امروز یک library زبان جاوااسکریپت رو به شما معرفی می کنیم که این امکان رو به راحتی هر چه تمامتر در اختیار شما قرار میده .
به طور مثال شما نمایش این انتخابگر رنگ یا همون Color Picker رو در زیر می تونید ببینید :

:: کتابخانه javascript مفید و کاربردی که این امکان رو برای ما فراهم میکنه jsColor هست . برای داشتن چنین انتخابگر رنگی در صفحات وب خود فقط کافیه دو خط کد به صفحه وب خودتون اضاف کنید . به همین راحتی !
:: این دو خط رو به این شکل به صفحه وب خودتون اضافه کنید :
1) افزودن فایل کتابخانه jsColor به صفحه وب
:: شما اول از همه باید کتابخانه jsColor رو در صفحه وب خودتون لود کنید . برای اینکار کافیه این خط رو درون تگ head صفحه وب خودتون استفاده کنید :

<script type="text/javascript" src="http://jscolor.com/jscolor/jscolor.js">
</script>

:: البته می تونید فایل های این کتابخانه جاوااسکریپت رو از اینجا دانلود کنید و در هاست شخصی قرار بدید و از آدرس خودتون استفاده کنید .
۲) قرار دادن فیلد input انتخابگر رنگ در صفحه وب
:: بعد از اینکه jsColor رو به شکلی که در بالا گفتیم به صفحه وبتون اضافه کردید ، برای اینکه یک انتخاب کننده ی رنگ در صفحه وب خودتون داشته باشید ، کافیه از یک تگ input نوع text استفاده کنید و کلاس color رو به اون اضافه کنید . در کل یعنی یه چنین تگی رو در هر کجای صفحه وب که دوست دارید Color Picker نمایش داده بشه استفاده کنید :

 <input type="text" class="color" />

:: اگر بخواید رنگ پیشفرضی رو برای فیلد انتخابگر رنگ داشته باشید کافیه کد اون رو در ویژگی value تگ input استفاده کنید . مثلا در خط زیر کد رنگ پیشفرض سبز تیره رو به صورت پیشفرض در نظر گرفتیم :

 <input type="text" class="color" value="008000"/>

:: پیشنهاد می کنم برای آشنایی بیشتر با رنگ ها در صفحات وب مطلب کد و نام رنگ ها در html و CSS رو ببینید .