رنگی شدن عکس هنگام hover

[MOHCEN 3]

چطور می شه عکس سیاه و سفید باشه وقتی موس رفت روش رنگی بشه؟ مثل این سایت jdesign

[I..R 1485]

عکس اول را ابتدا سیاه و سفید استایل دهید و هنگام hover عکس رنگی آن را قرار دهید css hover

[SM-Mahdavi 5428]

حالت سیاه و سفید

img.desaturate { -webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
filter: grayscale(100%);
}

[MOHCEN 3]

حالت سیاه و سفید

img.desaturate { -webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
filter: grayscale(100%);
}

نتونستم ازش استفاده کنم اگه ممکنه راهنمایی!

[جویا 69]

نتونستم ازش استفاده کنم اگه ممکنه راهنمایی!

سلام

کار خاصی نداره

توسط css آدرس عکس موردنظرتون رو تعریف کنید سپس کد رو به شکل زیر قرار بدید مثلا

.post img {
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
filter: grayscale(100%);
}

حال برای اینکه وقتی کاربر موس رو بر روی عکس موردنظر برد ، عکس بصورت رنگی نمایش داده شود

این کدرو قرار میدید

.post img:hover {
-webkit-filter: grayscale(0);
-moz-filter: grayscale(0);
filter: grayscale(0);
}

فقط یادتون باشه که بجای

.post img

باید آدرس مربوط به class یا id مرتبط با بخش موردنظرتون رو بدید.

ویرایش شده بهمن 92 توسط جویا

[Farid 2281]

حالت سیاه و سفید

img.desaturate { -webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
filter: grayscale(100%);
}

در تمامی مرورگرها هنوز پشتیبانی نمیشه . بهتر استفاده نشه و به جاش از jquery استفاده بشه