1

JQueryCycleプラグインの使用に問題があります。これを使用して、コンテンツの2つのコードブロック(画像、リンクされたテキスト、下部のナビゲーション)を呼び出しています。テストするページを読み込むと、最初のスライドでのみスタイルの最初の呼び出しがスローされます。 。スローされる要素には、position:relativeパラメーターがあります。HTMLは次のとおりです。

<div class="slide">
  <img src="images/cycle_img_test.jpg" />
  <figure class="slide_link">
  </figure>
  <p class="slidelink_text">1 View Our Reports</p>
  <img src="images/slider_arrow.png" class="link_arrow">
    <div class="slide_nav">
    </div>
      <div class="slidenav_content">
        <p class="nav_left">&lt;</p>
        <img src="images/slide_nav_current.png" />
        <img src="images/slide_nav_other.png" />
        <img src="images/slide_nav_other.png" />
        <img src="images/slide_nav_other.png" />
    <p class="nav_right">&gt;</p>
      </div>
</div>

これが.slideshowを呼び出しているJsです:

<script src="js/cycle.js"></script>
<script type="text/javascript">
        $(document).ready(function() {
            $('.slideshow').cycle({
                fx: 'fade' // choose your transition type, ex: fade,     scrollUp, shuffle, etc...
            });
        });
</script>

参照されているスタイルのCSSは次のとおりです。

.slide_link { width:217px; height:38px; background:#d2a709; opacity:.4; position:absolute; top:255px; z-index:10; }

.slidelink_text { vertical-align:center; font:bold 16px carto_bold, arial, helvetica, sans-serif; line-height:18px; letter-spacing:.01em; padding-left:35px; color:#fafafa; position:absolute; top:265px; z-index:11; }

.slide_nav { background:#3a4c5b; opacity:.6; width:605px; height:33px; position:relative; bottom:63px; left:25px; }

.slidenav_content { max-width:600; height:33px; position:relative; bottom:89px; left:35px; }

.slidenav_content img { position:relative; left:245px; }

.nav_left{ position:relative; float:left; color:#fff; }

.nav_right{ position:relative; float:right; right:395px; color:#fff; }

サイクルが最初のスライドの最初のキューだけでスタイルを誤ってロードしている理由についてアドバイスをいただければ幸いです。または、エラーがCSSにあるのか、Jsにあるのかを識別できたとしても、間違いなく役立ちます。

ありがとう!

4

2 に答える 2

0

誰も応答していないので、試してみます。

あなたの質問はちょっと漠然としています。ただし、このデモを参照として使用できます。

ご覧のとおり、すべての要素が含まrelativeれており、非常に明確でシンプルなレイアウトを使用しています。

関数の呼び出しで一貫したパラメーターが不足しているためcycle、HTML を表示する方法に干渉するため、例が機能しない場合があります。

幸運を。

于 2013-07-03T21:34:27.050 に答える