jQuery: 仅从右侧滑入

Question

我已经想出如何集成 jQuery 滑动切换功能，使我的标题在我的图像上滑动 in/out，但它从右下角滑入，我想要它仅从右侧滑动。

我必须将段落格式和位置保持在标题的底部，semi-transparent 白色填充跨越响应图像的整个高度。非常感谢任何帮助！

更新：我似乎可以在这个 jsFiddle 上使用它，但仍然不在网站上。演示：http://jsfiddle.net/tyuth1sr/16/

活动页面：http://parkerrichard.com/studiogreen/html/schools-caption-test.html

jQuery:

    $(window).load(function() {
      $('.flexslider').flexslider({
        animation: "fade"
      });
    });

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

CSS:

/* flexslider styling */

.flexslider {
    background:none !important;
    border:none !important;
    box-shadow:none !important;
}

.slides {
    overflow: hidden !important;
}

.right {
    right: 0;
    margin-bottom: 0px;
}

.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: 0px;
    display: none;
}

.show-caption {
    position: absolute;
    top: 48%;
    right: 100px;
    z-index: 100;
    opacity: 0.8;
    filter: alpha(opacity=80); /* For IE8 and earlier */
    pointer-events: none;
}

Answer 1

如果要使用JQuerytoggle()功能使它们从右边滑入，则需要使用JQuery UI effects
编辑：
你说你已经在使用JQueryUI，所以就用direction配置：
$('.caption-content').show("slide", { direction: "left" }, 1000);
JQuery UI API on toggle("slide")

jQuery: 仅从右侧滑入

jQuery: slide in from right side only

css

jquery

slide

flexslider