JSSOR Slider:将平铺菜单滑块布局从2行更改为4行?

时间:2015-01-10 22:38:24

标签: slider jssor

如何在JSSOR平铺菜单滑块中再添加2行?谢谢。

1 个答案:

答案 0 :(得分:0)

如果幻灯片定义如下,您将看到幻灯片中的所有内容都是完全可自定义的。要定义4行而不是2行,可以编辑css。

<div>
    <a class=appicon01 style="left: 0px; top: 0px; background-position:0px 0px;" href="#">
        <div class=appiconcb></div>
        <div class=appiconc>Menu Item 01</div>
    </a>
    <a class=appicon01 style="left: 160px; top: 0px; background-position:-160px 0px;" href="#">
        <div class=appiconcb></div>
        <div class=appiconc>Menu Item 02</div>
    </a>
    <a class=appicon01 style="left: 320px; top: 0px; background-position:-320px 0px;" href="#">
        <div class=appiconcb></div>
        <div class=appiconc>Menu Item 03</div>
    </a>
    <a class=appicon01 style="left: 480px; top: 0px; background-position:-480px 0px;" href="#">
        <div class=appiconcb></div>
        <div class=appiconc>Menu Item 04</div>
    </a>
    <a class=appicon01 style="left: 640px; top: 0px; background-position:-640px 0px;" href="#">
        <div class=appiconcb></div>
        <div class=appiconc>Menu Item 05</div>
    </a>

    <a class=appicon01 style="left: 0px; top: 160px; background-position:0px -160px;" href="#">
        <div class=appiconcb></div>
        <div class=appiconc>Menu Item 06</div>
    </a>
    <a class=appicon01 style="left: 160px; top: 160px; background-position:-160px -160px;" href="#">
        <div class=appiconcb></div>
        <div class=appiconc>Menu Item 07</div>
    </a>
    <a class=appicon01 style="left: 320px; top: 160px; background-position:-320px -160px;" href="#">
        <div class=appiconcb></div>
        <div class=appiconc>Menu Item 08</div>
    </a>
    <a class=appicon01 style="left: 480px; top: 160px; background-position:-480px -160px;" href="#">
        <div class=appiconcb></div>
        <div class=appiconc>Menu Item 09</div>
    </a>
    <a class=appicon01 style="left: 640px; top: 160px; background-position:-640px -160px;" href="#">
        <div class=appiconcb></div>
        <div class=appiconc>Menu Item 10</div>
    </a>
</div>