1

ロイヤルスライダーを使用しています。次のコードを自分のサイトの HTML に直接挿入しました (注: URL は省略されています)...

<!-- jQuery, 1.7+ is required -->
    <script  src="url"></script>
    <!-- main slider JS, get it from build tool http://dimsemenov.com/private -->
    <script src="url"></script>


    <!-- main slider style -->
    <link href="url">
    <!-- selected skin style -->
    <link href="url" rel="stylesheet">


    `<!-- slider css -->
    <style>
            /* you may put here additional slider CSS */
            /* but it'll be better if you move it to separate CSS file that your site uses */
    </style>

そして、本体に以下を入れてテストします...

<div id="content-slider" class="royalSlider contentSlider rsDefault">
<div>slide1</div>
<div>slide2</div>
<div>slide3</div>
</div>
<script type="text/javascript">// <![CDATA[
    // Slider initialization, you may put this part of code in JS file
    jQuery(document).ready(function($) {

        // slider initialization
        $('#content-slider').royalSlider({
            // example of slider options
            controlNavigation: 'bullets',
            autoPlay: {
                enabled: true
            },
            deeplinking: {
                enabled: true,
                prefix: 'slider-'
            }
        });

    });
// ]]></script>

スライドショーがまったくロードされていないようです。どんな提案や助けも大歓迎です!

アップデート：

以下を入れました。

<div id="content-slider" class="royalSlider contentSlider rsDefault">
      <div>slide1</div>
      <div>slide2</div>
      <div>slide3</div>
    </div>
<head>

// All your <head> content goes here

<script type="text/javascript">
$(document).ready(function(){

    // slider initialization
    $('#content-slider').royalSlider({
        // example of slider options
        controlNavigation: 'bullets',
        autoPlay: {
            enabled: true
        },
        deeplinking: {
            enabled: true,
            prefix: 'slider-'
        }
    });

});
</script>
</head>

そして、コードを次のように更新します...

<div id="content-slider" class="royalSlider contentSlider rsDefault">
<div>slide1</div>
<div>slide2</div>
<div>slide3</div>
</div>
<p>// All yourcontent goes here</p>
<script type="text/javascript">// <![CDATA[
$(document).ready(function(){

    // slider initialization
    $('#content-slider').royalSlider({
        // example of slider options
        controlNavigation: 'bullets',
        autoPlay: {
            enabled: true
        },
        deeplinking: {
            enabled: true,
            prefix: 'slider-'
        }
    });

});
// ]]></script>
4

1 に答える 1

1

の代わりにyour<script>を入れてみてください。は、ページがロードされるのをすでに待機しています。<head>body$(document).ready()

次のようにしてみてください。

<head>

// All your <head> content goes here

<script type="text/javascript">
$(document).ready(function(){

    // slider initialization
    $('#content-slider').royalSlider({
        // example of slider options
        controlNavigation: 'bullets',
        autoPlay: {
            enabled: true
        },
        deeplinking: {
            enabled: true,
            prefix: 'slider-'
        }
    });

});
</script>
</head>
于 2012-12-19T07:37:57.453 に答える