jQuery：仅从右侧滑入

Question

我已经想出了如何集成 jQuery 幻灯片切换功能以使我的标题在我的图像上滑入/滑出，但它是从右下角滑入的，我希望它只从右侧滑入。

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

更新：我似乎可以在这个 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

如果你想使用 JQuery toggle() 函数让它们从右侧滑入，你需要使用 JQuery UI effects
编辑：
您说您已经在使用 JQuery UI，所以只需使用 direction 配置：
$('.caption-content').show("slide", { direction: "left" }, 1000);
JQuery UI API on toggle("slide")