2

ローテーションクォートjqueryプラグインの実装についてサポートが必要です。

Jqueryコードは次のとおりです。

(function($) {
    $.fn.quovolver = function(speed, delay) {

        /* Sets default values */
        if (!speed) speed = 500;
        if (!delay) delay = 6000;

        // If "delay" is less than 4 times the "speed", it will break the effect 
        // If that's the case, make "delay" exactly 4 times "speed"
        var quaSpd = (speed*4);
        if (quaSpd > (delay)) delay = quaSpd;

        // Create the variables needed
        var quote = $(this),
            firstQuo = $(this).filter(':first'),
            lastQuo = $(this).filter(':last'),
            wrapElem = '<div id="quote_wrap"></div>';

        // Wrap the quotes
        $(this).wrapAll(wrapElem);

        // Hide all the quotes, then show the first
        $(this).hide();
        $(firstQuo).show();

        // Set the hight of the wrapper
        $(this).parent().css({height: $(firstQuo).height()});       

        // Where the magic happens
        setInterval(function(){

            // Set required hight and element in variables for animation
            if($(lastQuo).is(':visible')) {
                var nextElem = $(firstQuo);
                var wrapHeight = $(nextElem).height();
            } else {
                var nextElem = $(quote).filter(':visible').next();
                var wrapHeight = $(nextElem).height();
            }

            // Fadeout the quote that is currently visible
            $(quote).filter(':visible').fadeOut(speed);

            // Set the wrapper to the hight of the next element, then fade that element in
            setTimeout(function() {
                $(quote).parent().animate({height: wrapHeight}, speed);
            }, speed);

            if($(lastQuo).is(':visible')) {
                setTimeout(function() {
                    $(firstQuo).fadeIn(speed*2);
                }, speed*2);

            } else {
                setTimeout(function() {
                    $(nextElem).fadeIn(speed);
                }, speed*2);
            }

        }, delay);

    };
})(jQuery);

このコードを自分のWebサイト内にJSファイルとして保存しました

そして、これが私のHTMLです。

<link rel="stylesheet" media="screen" type="text/css" href="../../style.css" />
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="../../js/jquery.quovolver.js"></script>




<body>

         <div>
        I want my rotating quotes HERE


        </div>


</body>
</html>

$(’element’).quovolver();「次のコード行を使用して、ドキュメントレディ関数のスクリプトを呼び出す」ように言われました。

私の質問は、引用符をどこにどのように保存するか、そしてhtmlページでメモしたスペースでこのJqueryプラグインをどのように呼び出すかです。

ご協力いただきありがとうございます！！

4

1 に答える 1

0

これが私がドキュメントで見つけたものです：

Javascript（jQuery）

// CASE : in an extern file
// When document is ready...
$(document).ready(function() {
  // Call Quovolver on the '.quotes' object
  $('.quotes').quovolver();
});

// CASE : in HTML's head
<script>
    $(document).ready(function() {
      // Call Quovolver on the '.quotes' object
      $('.quotes').quovolver();
    });
</script>

HTML

<div class="quotes">
  <blockquote>
    <p>“That which can be asserted without evidence, can be dismissed without evidence.”&lt;/p>
    <p>— Christopher Hitchens (Quote 1)</p>
  </blockquote>

  <blockquote>
    <p>“Owners of dogs will have noticed that, if you provide them with food and water and shelter and affection, they will think you are god. Whereas owners of cats are compelled to realize that, if you provide them with food and water and shelter and affection, they draw the conclusion that they are gods.”&lt;/p>
    <p>— Christopher Hitchens (Quote 2)</p>
  </blockquote>

  <blockquote>
    <p>“Everybody does have a book in them, but in most cases that's where it should stay.”&lt;/p>
    <p>— Christopher Hitchens (Quote 3)</p>
  </blockquote>

  <blockquote>
    <p>“Beware the irrational, however seductive. Shun the 'transcendent' and all who invite you to subordinate or annihilate yourself. Distrust compassion; prefer dignity for yourself and others. Don't be afraid to be thought arrogant or selfish. Picture all experts as if they were mammals. Never be a spectator of unfairness or stupidity. Seek out argument and disputation for their own sake; the grave will supply plenty of time for silence. Suspect your own motives, and all excuses. Do not live for others any more than you would expect others to live for you.”&lt;/p>
    <p>— Christopher Hitchens (Quote 4)</p>
  </blockquote>

  <blockquote>
  <p>“Human decency is not derived from religion. It precedes it.”&lt;/p>
  <p>— Christopher Hitchens (Quote 5)</p>
  </blockquote>

  <blockquote>
    <p>“Many religions now come before us with ingratiating smirks and outspread hands, like an unctuous merchant in a bazaar. They offer consolation and solidarity and uplift, competing as they do in a marketplace. But we have a right to remember how barbarically they behaved when they were strong and were making an offer that people could not refuse.”&lt;/p>
    <p>— Christopher Hitchens (Quote 6)</p>
  </blockquote>
</div><!-- .quotes -->

.quotesクラスをに追加し、divこの例のように入力して、ドキュメントの読み込み時にjQueryコードを呼び出します。

于 2013-03-25T12:04:58.667 に答える