Основная задача блога - стать стартовой платформой для начинающих разработчиков, здесь не только буду писать свои статьи, но также буду выкладывать полезные ссылки которые помогут разобраться в разных вопросах. Будут затронуты темы: Ruby on Rails, PHP, MySQl, CodeIgniter, JQuery.
пятница, 26 августа 2011 г.
jQuery. Проверить видимость элемента на странице (видимый/невидимый)
Для того чтобы проверить видимый элемент или нет, можно воспользоваться двумя способами:
Смотря как скрывать: div id="test" style="visibility: hidden" так же как и div id="test" style="opacity: 0" проверка $(function(){alert($("#test").is(":visible"))}); покажет нам true. Все потому, что jQ (с версии 1.3 вроде бы) скрытыми считает элементы, которые 1. display:none 2. type="hidden" 3. ширина и высота которых равна 0 4. предок елемента попадает под условия (1-3).
обычно так и скрывают, если вы делаете так: $(selector).hide() то все правильно находит или же вы делаете $(selector).faedOut(), так как методы анимации которые скрывают элементы - в конце анимации будут присвоены display:none, то есть под условие опять попадают.
Нужно более грамотно скрывать элементы и все работает. Если прозрачность выставляется через анимацию вручную, то нужно в ее конце всеравно ставить display:none, это несложно - особенно если создавать новую jQuery функцию
Скрытие присвоением display значения none не резервирует место для объекта на экране, что иногда необходимо. Свойство visibility со значением hidden, в свою очередь это делает - объект просто не рендерится.
если необходимо резервировать место - можно просто обвернуть элемент в контейнер заданного размера, либо же просто реализовать свой метод $(selector).isHidden() который может проверять дополнительные опции элемента
Смотря как скрывать:
ОтветитьУдалитьdiv id="test" style="visibility: hidden"
так же как и
div id="test" style="opacity: 0"
проверка
$(function(){alert($("#test").is(":visible"))});
покажет нам true.
Все потому, что jQ (с версии 1.3 вроде бы) скрытыми считает элементы, которые
1. display:none
2. type="hidden"
3. ширина и высота которых равна 0
4. предок елемента попадает под условия (1-3).
обычно так и скрывают, если вы делаете так: $(selector).hide() то все правильно находит или же вы делаете $(selector).faedOut(), так как методы анимации которые скрывают элементы - в конце анимации будут присвоены display:none, то есть под условие опять попадают.
ОтветитьУдалитьНужно более грамотно скрывать элементы и все работает. Если прозрачность выставляется через анимацию вручную, то нужно в ее конце всеравно ставить display:none, это несложно - особенно если создавать новую jQuery функцию
Скрытие присвоением display значения none не резервирует место для объекта на экране, что иногда необходимо. Свойство visibility со значением hidden, в свою очередь это делает - объект просто не рендерится.
ОтветитьУдалитьесли необходимо резервировать место - можно просто обвернуть элемент в контейнер заданного размера, либо же просто реализовать свой метод $(selector).isHidden() который может проверять дополнительные опции элемента
ОтветитьУдалитьчего и требовалось ожидать - НИХУЯ НЕ РАБОТАЕТ
ОтветитьУдалитьчто именно у вас не работает?
Удалитьголова у него не работает=)
Удалитьпарень разочаровался в jquery видимо
Удалитькак использовать с if else ?
ОтветитьУдалитьif($('#elemnt').is(":visible"))
ОтветитьУдалить{
//do something
}
else
{
//do something
}