Wijmo ユーザーガイド > ウィジェット > FlipCard > マークアップとスクリプティング |
wijflipcard ウィジェットの HTML マークアップは、次のようになります。
マークアップ |
コードのコピー |
---|---|
<div id="flipcard1"> <div> <img src="Images\wijmo.png"><br /> <center>This is the front.</center></div> <div> <br /><br /> <center>This is the back.</center> </div> </div> |
次の jQuery スクリプトを使用して、ウィジェットを初期化できます。
スクリプト |
コードのコピー |
---|---|
<script id="scriptInit" type="text/javascript"> require(["wijmo.wijflipcard"], function () { $(document).ready(function () { $("#flipcard1").wijflipcard({ }); }); }); </script> |
ここで説明しているマークアップおよびスクリプトの結果、次のようなウィジェットが作成されます。フリップカードをクリックすると背面が表示され、もう一度クリックすると前面に戻ります。