barbitoff programmer`s blog

Здесь я публикую заметки из программерской жизни: грабли, на которые мне случилось наступить, проблемы, для которых было найдено элегантное (или не очень) решение, а также все, с чем мне пришлось столкнуться и чем хотелось бы поделиться =)
PS Если хотите меня поблагодарить - на странице есть 3 места, чтобы это сделать =)

пятница, 1 апреля 2011 г.

Кроссбраузерное затемнение экрана на CSS+jQuery


Кроссбраузерно.

CSS:

#TB_overlay
 {
 position: fixed;
 z-index: 3; /* при необходимости можно поменять на другой */
 top: 0;
 left: 0;
 height: 100%;
 width: 100%;
 background-color: #000;
 filter:progid:DXImageTransform.Microsoft.Alpha(opacity=55);
 -moz-opacity: 0.55;
 -khtml-opacity: 0.55;
 opacity: 0.55;
 }
* html #TB_overlay
 {
 position: absolute;
 height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + "px");
 }

Java Script:

if(!jQuery("body").find("#TB_overlay").is("div")) /* если фон уже добавлен не добавляем повторно */
 {
 if(!jQuery.browser.msie) /* если браузер не ИЕ фоном будет div */
  jQuery("body").append("<div id='TB_overlay'></div>");
 else /* иначе добавляем iframe */
  jQuery("body").append("<div id='TB_overlay'><iframe scrolling='no' frameborder='0' style='position: absolute; top: 0; left: 0; width: 100%; height: 100%; filter:alpha(opacity=0)'></iframe></div>");
 }
$("#TB_overlay").fadeIn("fast");



Комментариев нет:

Отправить комментарий