سرشار از زندگی

طبقه بندی موضوعی
پیوندهای روزانه


یک روز که داشتم دنبال صفحه کلید مجازی برای پروژه ام می گشتم، این صفحه کلید به نظرم جالب اومد:



 اما بعد از دریافت و قرار دادن این صفحه کلید توی نرم افزارتون متوجه می شید که کلیدهای اون همیشه ثابت هستند. برای افزایش امنیت بهتره هر بار ترتیب کلیدها عوض بشه. برای این منظور، طوری ویرایشش کردم که کلیدهاش هر بار جاشون عوض بشه.

برای استفاده از این صفحه کلید ابتدا اون رو از اینجا دریافت کنید و همون طور که تو فایل دریافتی موجوده، موارد زیر رو به بخش header صفحه ی HTML تون اضافه کنید (به jQuery و jQueryUI هم نیاز دارید):

<script src="../script/jquery-1.10.2.min.js" type="text/javascript"></script>
<script src="../script/jquery.keyboard.min.js" type="text/javascript"></script>
<script src="../script/jquery-ui.custom.min.js" type="text/javascript"></script>
<script src="../script/jquery.keyboard.extension-typing.js" type="text/javascript"></script>
<link href="../style/jquery-ui.min.css" rel="stylesheet" type="text/css" />
<link href="../style/keyboard.css" rel="stylesheet" type="text/css" />

حالا برای معرفی این که کدوم ورودی باید به این صفحه کلید مجهز بشه، از این کد استفاده کنید:

$(function () {
jQuery("#pass").keyboard({ openOn: null, stayOpen: true }).addTyping();
$("#pass").focus(function () { $('#pass').getkeyboard().reveal(); });
});

مثال کاملش رو می تونید اینجا ببینید. (Source code رو ببینید)

موافقین ۰ مخالفین ۰ ۹۲/۱۱/۲۴

نظرات  (۰)

هیچ نظری هنوز ثبت نشده است

ارسال نظر

ارسال نظر آزاد است، اما اگر قبلا در بیان ثبت نام کرده اید می توانید ابتدا وارد شوید.
شما میتوانید از این تگهای html استفاده کنید:
<b> یا <strong>، <em> یا <i>، <u>، <strike> یا <s>، <sup>، <sub>، <blockquote>، <code>، <pre>، <hr>، <br>، <p>، <a href="" title="">، <span style="">، <div align="">
تجدید کد امنیتی