角度旋转木马具有不同的图像大小

时间:2015-01-31 18:03:06

标签: css angularjs angular-carousel

我正在尝试使用AngularJS Touch Carousel指令为我的Ionic Framework移动应用程序创建旋转木马。

使用的轮播:https://github.com/revolunet/angular-carousel

我的小提琴:http://jsfiddle.net/Purus/tsvpu9cs/

问题是我的图像可以是任何尺寸。当图像大小不同时,我不确定如何获得良好的旋转木马,如小提琴所示。

以下是HTML代码。

<ul rn-carousel>
    <li>
        <div>
            <img src="http://files.parsetfss.com/f37c58f4-0d3b-4a98-9d18-1dcf4c0275f9/tfss-9a967bc5-bc21-425c-8468-2851493501b3-blouse.png" />
        </div>
    </li>
    <li>
        <div>
            <img src="http://files.parsetfss.com/f37c58f4-0d3b-4a98-9d18-1dcf4c0275f9/tfss-8886c78e-9641-43ba-b1b9-a503ef8dec5c-blouse.png" />
        </div>
    </li>
    <li>
        <div>
            <img src="http://files.parsetfss.com/f37c58f4-0d3b-4a98-9d18-1dcf4c0275f9/tfss-cc260a35-94b4-4d4d-b6e5-d280565ed983-blouse.png" />
        </div>
    </li>
    <li>
        <div>
            <img src="http://files.parsetfss.com/f37c58f4-0d3b-4a98-9d18-1dcf4c0275f9/tfss-2d818bea-f838-4d60-a99b-19c6655f33e5-blouse.png" />
        </div>
    </li>
</ul>

CSS如下:

ul {
    width: 500px;
    height:150px;
}

0 个答案:

没有答案