طراحی وب سایت | طراحی سایت | شرکت طراحی وب سایت پروگ پارس

ساعت انالوگ 24 ساعته

با استفاده از این پلاگین جی کوئری می توانید یک ساعت 24 ساعته آنالوگ ایجاد کنید

آموزش استفاده

1. فراخوانی کتابخانهjquery

<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript" src="knob.js"></script>
<script type="text/javascript" src="style.js"></script>

 

2.کد html جهت استفاده پلاگین و کد های اجرایی جی کوئری

<body style="color:#EEE;background:#222;" >
            <div style="position:relative;width:350px;margin:auto">
                <div style="position:absolute;left:10px;top:10px">
                    <input class="knob hour" data-readOnly="true" data-min="0" data-max="24" data-bgColor="#333" data-fgColor="#ffec03" data-displayInput="false" data-width="350" data-height="350" data-thickness=".25">
                </div>
                <div style="position:absolute;left:60px;top:60px">
                    <input class="knob minute" data-readOnly="true" data-min="0" data-max="60" data-bgColor="#333" data-displayInput="false" data-width="250" data-height="250" data-thickness=".35">
                </div>
                <div style="position:absolute;left:110px;top:110px">
                    <input class="knob second" data-readOnly="true" data-min="0" data-max="60" data-bgColor="#333" data-fgColor="rgb(127, 255, 0)" data-displayInput="false" data-width="150" data-height="150" data-thickness=".2">
                </div>
            </div>
        <script>
            function clock() {
                var $s = $(".second"),
                    $m = $(".minute"),
                    $h = $(".hour");
                d = new Date(),
                s = d.getSeconds(),
                m = d.getMinutes(),
                h = d.getHours();
                $s.val(s).trigger("change");
                $m.val(m).trigger("change");
                $h.val(h).trigger("change");
                setTimeout("clock()", 1000);
            }
            clock();
        </script>

</body>

نکته این ساعت 24 ساعته است

نظر دهید

دانلود و پیش نمایش

دانلود و پیش نمایش فایل ساعت انالوگ 24 ساعته

دانلود پلاگین پیش نمایش آنلاین

سوالی دارید؟

● در تلگرام، پاسخگوی شما :)