jQuery slide изначально активен

Question

У меня есть заголовок, который использует слайд jQuery, чтобы исчезнуть из вида при щелчке изображения.

Я пытаюсь сделать заголовок «слайд» первоначально активным (скрытым), после чего он появится после щелчка изображения, скользящего справа (не снизу). Спасибо за помощь!

JQuery:

$("#slideshow").click(function() { 
     $(".flex-caption").toggle("slide"); 
    }); 

JSFiddle: http://jsfiddle.net/tyuth1sr/1/

Answer 1

.flex-caption { 
    ... 
    padding-bottom: 100%; 
    top: 0px; 
    display: none; 
} 

Demo

Answer 2

один способ, которым Вы могли бы вид сыра, оно, пытаясь установить абсолютную высоту на подписи к важным!. Таким образом, слайд-функция jQuery не сможет изменить высоту, заставляя ее выглядеть так, как будто она идет справа.

См http://jsfiddle.net/tyuth1sr/11/

мне пришлось изменить некоторые классы вокруг, а высота будет трудно сделать отзывчивым имо. Вот код, я изменил:

.bottom { 
    bottom: 0; 
    margin-bottom: 0px; 
    position:absolute; 
} 

.flex-caption { 
    position: absolute; 
    text-align: left; 
    background:rgba(255, 255, 255, 0.7); 
    z-index: 1; 
    padding: 20px; 
    width: 295px; 
    padding-top: 100%; 
    bottom: 20px; 
    right:0; 
    height:650px !important; /* should be set to height of container - 40 for padding */ 
} 

<div class="flex-caption "> 
    <div class="caption-content bottom"> 
     <p>Taectur sinti consed magnimp oreptatem que est essi cuptus doluptate pratis rero omni con fugitatius venienimus. Xim fuga. Iliqui omnim comnimus estiorrum cum et accus et liquia nos.</p> 
    </div> 
</div> 

Вы могли бы быть в состоянии дать родителю (.flex-слайдер) коробка-размеров: границы окна; затем дайте flex-caption высоту 100%! важно;