ثبت‌نام

کد آماده شماره‌گیر تلفن | HTML, CSS, JavaScript

📅 1405/01/27 👁️ 223 بازدید
کد آماده شماره‌گیر تلفن | HTML, CSS, JavaScript

یک شماره‌گیر سبک، واکنش‌گرا و آماده با طراحی تاریک و مدرن.

این پروژه با HTML، CSS و JavaScript خالص نوشته شده و بدون نیاز به هیچ کتابخانه خارجی اجرا می‌شود. مناسب برای آموزش کار با رویدادهای کلیک، دستکاری DOM و طراحی رابط کاربری.

🎯 امکانات

  • نمایشگر دیجیتال با استایل رترو
  • دکمه‌های شماره‌گیری ۰ تا ۹
  • دکمه پاک کردن (حذف رقم آخر)
  • دکمه تماس با نمایش alert
  • طراحی واکنش‌گرا و سازگار با موبایل
  • افکت hover روی تمام دکمه‌ها
  • رنگ‌بندی حرفه‌ای (سبز برای تماس، قرمز برای حذف)

🎨 طراحی ظاهری

  • پس‌زمینه گرادیانت تیره
  • بدنه شماره‌گیر با گوشه‌های گرد و سایه
  • نمایشگر با رنگ سبز فسفری (استایل رترو)
  • چیدمان دکمه‌ها به صورت Grid 3×4
  • انیمیشن تغییر رنگ روی دکمه‌ها

📦 محتویات فایل‌ها

  • index.html — ساختار شماره‌گیر
  • style.css — استایل‌دهی کامل
  • script.js — منطق شماره‌گیری و رویدادها

🚀 نحوه استفاده

  1. هر سه فایل را در یک پوشه قرار دهید
  2. فایل index.html را با مرورگر باز کنید
  3. شروع به شماره‌گیری کنید

📋 مشخصات فنی

  • تکنولوژی: HTML5, CSS3, JavaScript (Vanilla)
  • طراحی: واکنش‌گرا (Responsive)
  • وابستگی: بدون کتابخانه خارجی
  • تعداد فایل: ۳
  • حجم کل: کمتر از ۵ کیلوبایت

🎁 این سورس مناسب چه کسانی است؟

  • افراد مبتدی که می‌خواهند کار با DOM را یاد بگیرند
  • دانشجویان برای پروژه‌های دانشگاهی
  • توسعه‌دهندگانی که به یک کامپوننت شماره‌گیر آماده نیاز دارند
  • علاقه‌مندان به طراحی رابط کاربری

💡 ایده‌های توسعه

  • اتصال به WebRTC برای تماس واقعی
  • ذخیره تاریخچه تماس‌ها در LocalStorage
  • اضافه کردن لیست مخاطبان
  • پخش صدای بوق هنگام شماره‌گیری
  • نمایش نام مخاطب هنگام تایپ شماره

شرایطی که در آن بابت دانلود این سورس سکه‌ای از شما کم نمی‌شود:

  • اگر خودِ شما این سورس را در سایت آپلود کرده باشید.
  • اگر قبلاً بابت دانلود این سورس سکه پرداخت کرده باشید.
  • اگر سورس رایگان باشد.

برای مشاهده آخرین وضعیت سکه‌ها، لطفاً صفحه را به‌روزرسانی کنید.

دسته‌بندی های مرتبط با این سورس
آزمایشی

گفتگو درباره این سورس



×
تصویر پروفایل
⏳ در حال بارگذاری...