jQuery

【jQuery】グラフィカルな評価を作成するためのプラグインjQuery Rate

October 15, 2017
jQuery Rate

jQuery Rateはグラフィカルな評価を作成するためのjQueryプラグイン。

JS&CSS

    <!-- External CSS and JS Libraries - Optional -->
    <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
    <script type="text/javascript" src="https://code.jquery.com/jquery-1.11.3.min.js"></script>

    <!-- jQury Rate CSS and JS -->
    <link rel="stylesheet" type="text/css" href="rate/rate.min.css">
    <script type="text/javascript" src="rate/jquery.rate.min.js"></script>

    <!-- Demo CSS and JS -->
    <link rel="stylesheet" type="text/css" href="demo/demo.css">
    <script type="text/javascript" src="demo/demo.js"></script>

HTML

        <div class="row">
            <div class="col-lg-2">
                <div class="rate-circle-static-small" data-value="12"></div>
            </div>
            <div class="col-lg-2">
                <div class="rate-circle-static-small" data-value="34"></div>
            </div>
            <div class="col-lg-2">
                <div class="rate-circle-static-small" data-value="55"></div>
            </div>
            <div class="col-lg-2">
                <div class="rate-box-static-small" data-value="12"></div>
            </div>
            <div class="col-lg-2">
                <div class="rate-box-static-small" data-value="34"></div>
            </div>
            <div class="col-lg-2">
                <div class="rate-box-static-small" data-value="55"></div>
            </div>
        </div>

MIT