تبلیغات در اینترنت

تبلیغات در اینترنتگیفت کارت گوگل پلی
نمایش نتایج: از 1 به 2 از 2

مقاله: آموزش سیاه و سفید کردن تصاویر با پشتیبانی از همه مرورگر ها

    1. آموزش سیاه و سفید کردن تصاویر با پشتیبانی از همه مرورگر ها »

      آموزش سیاه و سفید کردن تصاویر با پشتیبانی از همه مرورگر ها

      نگارش: , by (مدیریت کل سایت)
      2013/11/27 07:04 PM
      امتیاز: 

      در این آموزش نحوه سیاه و سفید کردن تصاویر با استفاده از CSS Filter ها و SVG که از تمامی مرورگر ها حتی اینترنت اکسپلورر پشتیبانی می کند را قصد داریم آموزش دهیم.


      برای سیاه و سفید کردن تصویر (یا المنت) در مرورگر های جدید که از CSS Filter پشتیبانی می کنند از خاصیت grayscale با مقدار 100% استفاده می کنیم.


      کد:
      -webkit-filter:grayscale(100%);
      -moz-filter:grayscale(100%);
      و اما برای اینترنت اکسپلورر و حتی موزیلا فایرفاکس استفاده از فیلتر SVG حتما نیاز است.


      نمونه کد به صورت زیر می باشد.


      کد:
      filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter ….3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
      filter: gray;


      برای اینکه کد مذکور cross-browser باشد و از تمام مرورگر ها پشتیبانی کند کد های بالا را مخلوط می کنیم که نتیجه نهایی به این صورت است.


      کد:
      .class img {
      filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter ….3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
      filter: gray;
      -webkit-filter: grayscale(100%);
      -moz-filter:grayscale(100%);
      
      }
      موفق باشید.
  1. Top | #2
    کاربر اخراجی

    ورژن ویبولتین
    Suite 4.2.2
    نوشته ها
    1,346
    میزان امتیاز
    0

    پیش فرض

    کاربردش چیه؟

    کاربر مقابل از Nimaking بابت این پست مفید تشکر کرده است:


اطلاعات موضوع

کاربرانی که در حال مشاهده این موضوع هستند

در حال حاضر 1 کاربر در حال مشاهده این موضوع است. (0 کاربران و 1 مهمان ها)

کسانی که این مقاله را دیده اند از این مقاله ها نیز بازدید کرده اند

  1. پاسخ: 5
    آخرين نوشته: 2014/01/06, 11:13 PM
  2. پاسخ: 1
    آخرين نوشته: 2013/01/07, 10:13 PM
  3. پاسخ: 1
    آخرين نوشته: 2012/12/04, 01:21 AM

علاقه مندی ها (Bookmarks)

علاقه مندی ها (Bookmarks)

مجوز های ارسال و ویرایش

  • شما نمیتوانید موضوع جدیدی ارسال کنید
  • شما امکان ارسال پاسخ را ندارید
  • شما نمیتوانید فایل پیوست کنید.
  • شما نمیتوانید پست های خود را ویرایش کنید
  •