html溢出：隐藏在下拉菜单中

我正在尝试解决我的下拉菜单中的溢出问题。对于雪橇，我使用的是als-js框架。问题是，如果我设置了overflow：hidden属性，那么我的下拉菜单将不再可见。如果我只设置了overflow-x：hidden，我会得到一个滚动条。

<div class="als-container" id="cssmenu"> <span class="als-prev"><img src="back.png" alt="back" title="previous" /></span>

<div class="als-viewport">
    <ul class="als-wrapper">
        <li class='als-item active'><a href='index.html'>Home</a>

            <ul>
                <li class='final'><a href='#'>Test 1</a>

                </li>
                <li class='final'><a href='#'>Test 2</a>

                </li>
            </ul>
            <li class=' als-item has-sub '><a href='#'>Products</a>

                <ul>
                    <li class='final'><a href='#'>Product 1</a>

                    </li>
                    <li class='final'><a href='#'>Product 2</a>

                    </li>
                    <li class='final'><a href='#'>Product 2</a>

                    </li>
                    <li class='final'><a href='#'>Product 2</a>

                    </li>
                    <li class='final'><a href='#'>Product 2</a>

                    </li>
                    <li class='final'><a href='#'>Product 2</a>

                    </li>
                </ul>
            </li>
            <li class="als-item"><a href='#'>About</a>

            </li>
            <li class='als-item active'><a href='index.html'>Admin</a>

            </li>
            <li class='als-item active'><a href='index.html'>Route</a>

            </li>
    </ul>
</div>

jQUery：

$(document).ready(function () {
$("#cssmenu").als({
    visible_items: 4,
    scrolling_items: 2,
    orientation: "horizontal",
    circular: "yes",
    autoscroll: "no"
});
});

这是我的小提琴的链接。http://jsfiddle.net/9zapu02q/11/

也许有人可以帮助我找到解决方案。