Как создать кросс-браузерный совместимый эффект «прожектора»?

Question

Я обнаружил плагин для Jquery, но он не работает в IE.

так есть ли способ заставить остальной фон исчезать до темного цвета, пока выбран или элемент фокусировки остается прежним?

Answer 1

Я уверен, что где-то есть кросс-браузерное решение. Кроме этого, это может быть наполовину легко, используя фиксированный полноэкранный оверлей:

.overlay
 { position: fixed;
   background-color: white; 
   opacity: 0.5; /* Add IE opacity here */
   top: 0px; right: 0px; left: 0px; bottom: 0px;
   z-index: 1000;
  }

... добавив его и присвоив сфокусированному элементу ввода "position: относительный" и z-индекс 1001. Не проверено, но должно работать в кросс-браузерном режиме. Будут проблемы с элементами Flash и тому подобное, для которых вы найдете обходные пути в скриптах в стиле лайтбокса.

Answer 2

Вы можете взглянуть на Expose jQuery Tools, который должен работать в IE 7 и 8. Если вы хотите, чтобы он работал в IE 6, может потребоваться некоторая настройка, чтобы создать решетку GIF (наполовину прозрачные и наполовину серые пиксели в шахматном порядке) или используйте какой-то фильтр.