дисплея ДИВЫХ рядный скрытый

Question

я определяю шаблон следующим образом:

$.template('aTemplate', 
    '<div id="someid" class="abc">' + 
    .... 
    '</div>' 
); 

Я хочу это Див быть рядным с другими элементами (там, где я размещаю их). Я также хочу, чтобы этот div был скрыт (когда я добавляю его в DOM), а затем стал видимым в некоторых других действиях (щелчок пользователя).

Итак, чтобы сделать это рядный и скрытый, я определяю следующие CSS

.abc { 
    display: inline-block; 
    visibility: hidden; 
} 

и на какое-то действие, у меня есть

$('#someid').show() 

Но это не похоже на работу. Любые предложения относительно того, что можно исправить?

Answer 1

Ваша проблема $.show() установит display:inline-block

Из документов:
http://api.jquery.com/show/
совпавшие элементы будут выявлены сразу, без анимации. Это примерно эквивалентно вызову .css ('display', 'block'), за исключением того, что свойство отображения восстанавливается до того, что было изначально. Если элемент имеет отображаемое значение inline, то он скрыт и отображается, он снова будет отображаться в строке.

Если вы хотите, DIV, чтобы сохранить это положение в DOM, попробуйте установить его непрозрачность на 0, чтобы начать:

.abc { 
    display: inline-block; 
    opacity: 0; 
} 

Тогда звоните:

$('#someid').css('opacity','1');