2秒間隔でjQuery .flip（）が機能しない

Question

私は3秒間、x軸を2秒間隔で繰り返しています（繰り返す）。

のjQuery：

$(function() { 
count = 0; 
wordsArray = ["Quality", "Performance", "Solutions"]; 
setInterval(function() { 
    count++; 

    $("words").text(wordsArray[count % wordsArray.length]).flip({ axis: 'x' }); 

    }, 2000); 
}); 

HTML：

<span id="words">Solutions</span> 

代わりの裏返し、何も起こりません。

私は言葉がでこのコードを使用してフェードアウトさせることができています：

$(function() { 
count = 0; 
wordsArray = ["Quality", "Performance", "Solutions"]; 
setInterval(function() { 
    count++; 
    $("#words").fadeOut(400, function() { 
     $(this).text(wordsArray[count % wordsArray.length]).fadeIn(400); 
    }); 
    }, 2000); 
}); 

私が含まれています：

<script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-2.2.0.min.js"></script> 
<script type="text/javascript" src="~/js/jquery.flip.js"></script> 

.flip（）から来ている：私はhttps://nnattawat.github.io/flip/

言葉を反転させる機能に何か不足していますか？

Answer 1

flip（）の命令では、前面と背面のクラスを持つ子要素が必要です。

は

<span id="words"> 
    <span class="front"></span> 
    <span class="back"></span> 
</span> 

とJavaScriptのようなあなたのhtmlを試してみてくださいhttps://nnattawat.github.io/flip/

<div id="card"> 
    <div class="front"> 
    Front content 
    </div> 
    <div class="back"> 
    Back content 
    </div> 
</div> 

からコピー：エラーがブラウザのコンソールになっていると、あなたはどのようなライブラリが含まれなかった何

$(function() { 
count = 0; 
wordsArray = ["Quality", "Performance", "Solutions"]; 
setInterval(function() { 
    count++; 
    $("#words").text(wordsArray[count % wordsArray.length]).flip({ axis: 'x' });  
    }, 2000); 
});