Jquery的Simplyscroll在容器/片段添加左和右圖像

Question

我使用的Jquery Simplyscroll（http://logicbox.net/jquery/simplyscroll/）和我尋找到在兩個添加的圖像（褪色PNG）的方法左側和右側，以免我的圖片「切斷」一次滑動的。

我滾輪的代碼：

<script type="text/javascript"> 
    (function($) { 
     $(function() { 
      $("#scroller").simplyScroll(); 
     }); 
    })(jQuery); 
    </script> 

    <ul id="scroller"> 
     <li><img src="http://logicbox.net/jquery/simplyscroll/assets/20080608_9N3H5GYL_tb.jpg" width="290" height="200" alt="Firehouse"></li> 
     <li><img src="http://logicbox.net/jquery/simplyscroll/assets/20080513_4D3SD1BQ_tb.jpg" width="290" height="200" alt="Chloe nightclub"></li> 
     <li><img src="http://logicbox.net/jquery/simplyscroll/assets/20080513_VPJWVQRW_tb.jpg" width="290" height="200" alt="Firehouse bar"></li> 
     <li><img src="http://logicbox.net/jquery/simplyscroll/assets/20080514_B1YJ08B6_tb.jpg" width="290" height="200" alt="Firehouse chloe club fishtank"></li> 
     <li><img src="http://logicbox.net/jquery/simplyscroll/assets/20080514_JYW68XPT_tb.jpg" width="290" height="200" alt="Firehouse restaurant"></li> 
     <li><img src="http://logicbox.net/jquery/simplyscroll/assets/20080608_38CG51J2_tb.jpg" width="290" height="200" alt="Firehouse"></li> 
    </ul> 

會是什麼，以便在最佳實踐/方法爲我做到這一點？

一些意見，將不勝感激。

謝謝 帕特里克

Answer 1

我找到了一個臨時解決方案：

.mask { 
     -webkit-mask: -webkit-linear-gradient(
       left, 
      rgba(255,255,255,0), 
      rgba(255,255,255,1) 5%, 
      rgba(255,255,255,1) 95%, 
      rgba(255,255,255,0) 
     );