0

こんにちは、

jQuery Liquid Carousel プラグインjquery carouselに基づいて開発していますが、次の矢印と前の矢印が表示されません。これはなぜですか?

私のコードはここにあります: http://jsfiddle.net/g8FaN/

<head>
    <title></title>
    <link rel="stylesheet" href="http://www.nikolakis.net/liquidcarousel/css/liquidcarousel.css" />
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
    <script type="text/javascript" src="http://code.jquery.com/ui/1.9.1/jquery-ui.js"></script>
    <script type="text/javascript" src="http://www.nikolakis.net/liquidcarousel/js/jquery.liquidcarousel.pack.js"></script>
    <script>
        $(document).ready(function () {
            $('#liquid').liquidcarousel({ height: 129, duration: 100, hidearrows: false });
        });
    </script>
</head>
<body>
    <div style ="width:200px">
        <div id="liquid">
            <span class="previous"></span>
            <div class="wrapper">
                <ul>
                    <li><a href="#">
                        <img src="http://web.scott.k12.va.us/martha2/dmbtest.gif" width="88" height="126" alt="image" /></a></li>
                    <li><a href="#">
                        <img src="http://web.scott.k12.va.us/martha2/dmbtest.gif" width="88" height="126" alt="image" /></a></li>
                    <li><a href="#">
                        <img src="http://web.scott.k12.va.us/martha2/dmbtest.gif" width="88" height="126" alt="image" /></a></li>
                    <li><a href="#">
                        <img src="http://web.scott.k12.va.us/martha2/dmbtest.gif" width="88" height="126" alt="image" /></a></li>
                    <li><a href="#">
                        <img src="http://web.scott.k12.va.us/martha2/dmbtest.gif" width="88" height="126" alt="image" /></a></li>
                    <li><a href="#">
                        <img src="http://web.scott.k12.va.us/martha2/dmbtest.gif" width="88" height="126" alt="image" /></a></li>
                    <li><a href="#">
                        <img src="http://web.scott.k12.va.us/martha2/dmbtest.gif" width="88" height="126" alt="image" /></a></li>
                    <li><a href="#">
                        <img src="http://web.scott.k12.va.us/martha2/dmbtest.gif" width="88" height="126" alt="image" /></a></li>

                    <li><a href="#">
                        <img src="http://web.scott.k12.va.us/martha2/dmbtest.gif" width="88" height="126" alt="image" /></a></li>
                    <li><a href="#">
                        <img src="http://web.scott.k12.va.us/martha2/dmbtest.gif" width="88" height="126" alt="image" /></a></li>
                    <li><a href="#">
                        <img src="http://web.scott.k12.va.us/martha2/dmbtest.gif" width="88" height="126" alt="image" /></a></li>
                    <li><a href="#">
                        <img src="http://web.scott.k12.va.us/martha2/dmbtest.gif" width="88" height="126" alt="image" /></a></li>
                </ul>
            </div>
            <span class="next"></span>
        </div>
    </div style ="width:200px">
</body>

[次へ] ボタンと [前へ] ボタンが表示されないため、ここで何が間違っていたのでしょうか? 誰でも調べることができますか？

4

2 に答える 2

0

画像を保持しているdivのに変更<div id="liquid">します。<div class="liquid">

次に、jqueryコードを次のように変更します$('.liquid')...

ここでそれをjsfiddleで見ることができます：http：//jsfiddle.net/g8FaN/1/

于 2013-02-22T15:40:34.423 に答える
-1

Liquidcarousel.css を開き、このクラスを検索します

.liquid ul li {
    width:126px;
    padding:0 2px;
    margin:0;
}

widthプロパティを削除します

.liquid ul li {
    padding:0 2px;
    margin:0;
}

常に画像の高さを設定し、高さに応じて幅を動的にします。確かにそれは動作します。

于 2013-03-19T13:09:18.317 に答える