幻灯片（有意）重叠

Question

我有这张幻灯片：

<div id="leftBtn">Left</div>
<div id="rightBtn">Right</div>

<div id="wrapper">
    <div id="slideshowContainer">
        <div id="slide_1" class="slide"></div>
        <div id="slide_2" class="slide"></div>
        <div id="slide_3" class="slide"></div>
        <div id="slide_4" class="slide"></div>
    </div>
</div>

......左侧滑动效果。它工作得很好（jimjimmy1995代码的所有功劳）。我想要的是每个幻灯片在单击右键时与前一个幻灯片重叠，而在单击左键时相反。调整不透明度也很不错。 这是Fiddle。 提前谢谢。

佩德罗