Вёрстка « Как затемнить и заблокировать блок на CSS

Есть элемент таблицы(td), нужно его затемнить и сделать неактивным, т.е. чтобы нельзя было никуда нажать мышкой в этом блоке. Как это организовать?

Заранее благодарен!

1 ответов


Заминусовали меня :) а я просто не понял вопроса, вот полностью рабочий пример http://jsfiddle.net/uPTKb/6/ , проставляете class="disable" td который хотите блокировать, не забудьте скопировать JS и класс .blocker в css


А зачем jQuery? Всё делается на чистом css: http://jsfiddle.net/gakkJ/.


.disable {
 position: relative;  
}

.disable:after {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0.5);  
  content: "";
}
 

Задать класс или идентификатор td например . Потом в css задать .myTd { background-color:grey;} td по идее не кликабельный элемент, если же у вас по нажатию на него что-то происходит, значит это где-то в скрипте ищите обработчик и просто закомментируйте его.


Можно с помощью jQuery:


<table>
 <tbody>
  <tr>
   <td id="unselectable">
   </td>
  </tr>
 </tbody>
</table>
 

  $.fn.disableSelection = function() {
    return this.each(function() {          
      $(this).attr('unselectable', 'on')
           .css({
             '-moz-user-select':'none',
             '-webkit-user-select':'none',
             'user-select':'none',
             '-ms-user-select':'none'
           })
           .each(function() {
             this.onselectstart = function() {return false;};
           });
    });
  };

       $(function(){
        $('#unselectable').disableSelection();
       });
 

В этом случае, всё находящиеся в ячейке нельзя будет выделить.

[UPD]
Что бы кнопки стали неактивными, надо указать у них атрибут disabled="disabled"