Wijmo UI for the Web
マークアップとスクリプティング

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>

ここで説明しているマークアップおよびスクリプトの結果、次のようなウィジェットが作成されます。フリップカードをクリックすると背面が表示され、もう一度クリックすると前面に戻ります。

関連トピック

参照

 

 


Copyright © GrapeCity inc. All rights reserved.