Скрыть div, но сохранить пустое пространство

У меня есть следующий div

CSS

.description {
    color: #b4afaf;
    font-size: 10px;
    font-weight: normal;
}

HTML

<div class="description">Some text here </div>

Затем у меня есть функция щелчка на элементе, чтобы скрыть указанный выше div:

$('#target').click(function(){
  $(".description").hide();
});

Когда я скрою div, он рухнет (прекратите принимать любое пространство). Это возится с макетом моей страницы.

Есть ли способ скрыть div, но все-таки взять пространство, которое оно принимало раньше? Я не хочу менять цвет шрифта, потому что он будет по-прежнему доступен.

Спасибо

Ответ 1

Используйте visibility свойство css для этого

видимость:

Свойство visibility указывает, будут ли поля, созданные элемент визуализируется.

$(".description").css('visibility', 'hidden');

Демо: Fiddle

Ответ 2

И еще один вариант для полноты. Переключить opacity:

$(".description").css('opacity', 0); // hide
$(".description").css('opacity', 1); // show

http://jsfiddle.net/KPqwt/

Однако использование visibility предпочтительнее для этой задачи.

Ответ 3

Try:

$(".description").css("visibility", "hidden")

hide() является эквивалентом: $(".description").css("display", "none");

Что не резервирует пространство, которое принимал элемент.

Hidden делает элемент невидимым, но неподвижное сохраняет пространство.

Ответ 4

Важно отметить, что dfsq пример с использованием Opacity: 0 все равно позволит выбирать содержимое, копировать/вставлять и т.д., хотя нет видимого текста -высокая яркость при выборе.

Ответ 5

вы можете обернуть еще один div вокруг него и, вероятно, указать ему определенную высоту. таким образом ваш внутренний div может показать и скрыть и fadeOut и т.д., а внешний div будет удерживать недвижимость на странице.