ایجاد: ۲۱:۵۸ ۱۳۹۱/۹/۹
ویرایش: ۱۲:۴۲ ۱۳۹۲/۱۱/۲۷

یادداشت‌ها

»

زوم (zoom) و بزرگنمایی تصویر و متن با جاوا اسکریپت و پی اچ پی

زمانی که تصویر شما دارای اطلاعات و جزئیات مفیدی است که در صفحه مانیتور کاربر قابل نمایش نیست (مثل نقشه جغرافیایی یا یک کالای خاص)، بزرگنمایی (zoom) یکی از ضروری‌ترین نیازها خواهد بود. در ادامه به چند نمونه کد جاوا اسکریپت و php در این زمینه اشاره می‌شود:
  • mLens
    با رفتن شما روی تصویر از پیش تعیین شده، اشاره‌گر موس به صورت یک لنز و ذره‌بین درمی‌آید. در لینک بالا نمونه عملی + لینک دانلود این اسکریپت 3 کیلوبایتی قابل دسترس است.
  • zoom.js
    در تلفن‌های هوشمند لمسی، با دو بار کلیک روی یک صفحه وب آن صفحه بزرگ می‌شود. فایل جاوا اسکریپت فوق، همین ایده جالب را در یک صفحه وب پیاده کرده طوری که با 1 کلیک روی هر المان، آن المان بزرگ می‌شود و با کلیک مجدد روی آن یا زدن دکمه escape روی کیبورد، به حالت قبل برمی‌گردد. برای مشاهده نمونه عملی، در این صفحه روی یک متن یا تصویر یکبار کلیک کنید...
  • Cropbox
    هدف اصلی این پلاگی در واقع زوم نیست. بلکه امکان زوم روی یک تصویر و همچنین درگ را فراهم کرده تا کاربر بتواند بخشی از تصویر را در قاب از پیش تعیین‌شده قرار داده و سپس برش بزند (Crop کند) و همانجا dataURi بخش برش خورده را تحویل بگیرد!
    کاربرد این پلاگین برای من، در مواردی است که مدیر می‌خواهد بخشی از تصویر مطلب را به عنوان تصویر کوچک آن مطلب (Thumbnail) انتخاب کند...
  • jquery.innermovement
    این پلاگین بسیار ساده جی‌کوئری، برای حرکت تصویر بزرگ crop شده در یک قاب محدود، بر اساس موقعیت موس کاربرد دارد. (مشاهده نمونه اجرا شده با این پلاگین که البته فریم بسیار کوچکی در این مثال انتخاب شده و باید بزرگتر انتخاب می‌شد.)
  • jQuery_mk_magnifier
    یک زوم ساده و زیبا با حجم یک کیلوبایت. (نسخه نمایشی)

یادداشت‌های مرتبط
  1. سرویس های آنلاین رایگان برای نوشتن، تست و بهینه سازی کدهای برنامه نویسی
  2. جایگزین های alert (لایت باکس ها)
  3. همه چیز درباره داده ها و تصاویر Inline درون برنامه ای
  4. روش های بهبود کیفیت آپلود فایل ها از طریق فرم های صفحات وب
  5. تولید کپچای ضد گلوله!
  6. تشخیص و کشف نوع، نام و مشخصات مرورگر کاربران سایت
  7. قلمرو متغیرها در پی اچ پی و جاوا اسکریپت
  8. دسترسی کامل به عناصر آدرس در جاوا اسکریپت
  9. بهینه سازی و کاهش حجم تصاویر برای استفاده در صفحات وب
  10. درباره نود جی اس
  11. افکت های متن با جاوا اسکریپت و جی کوئری
  12. خطا در جاوا اسکریپت
  13. پایگاه داده در جاوا اسکریپت
  14. روش ها و تکنیک های پنهان کردن ایمیل
  15. کشف فونت های نصب شده در کلاینت
  16. بازی با زمان!
  17. کار با تصاویر در سمت کاربر
  18. بهینه سازی آنلاین سی اس اس و جاوا اسکریپت
  19. استفاده از Media Queries ها و اصلاح عدم پشتیبانی IE6-8
  20. چند لینک جامع برای یادگیری جاوا اسکریپت
  21. انواع راه های تولید کد QR با پی اچ پی و جاوا اسکریپت

مدیریت

نام وسیله

اعتبار ورود

نام کاربری

رمز عبور

رمز یکبارمصرف

... لیست تمام یادداشت‌ها

تبلیغات

ربات‌های تلگرامی:
مجموعه ربات‌های تلگرامی ما برای ساده‌تر کردن کار با تلگرام و مدیریت کانال
دامنه‌های فروشی:
دامنه‌های زیر مربوط به ما یا مشتریان ماست که قابل واگذاری هستند. در صورت تمایل به داشتن یکی از آنها، با این اکانت تلگرامی مکاتبه نمایید.

دامنه‌هایی که می‌تواند مصرف تخصصی داشته باشد:
AnyDesk.ir, Firebase.ir, Angularjs.ir, 9px.ir alAdmin.ir, iQore.ir notion.ir, 3dn.ir,

دامنه‌هایی که می‌تواند مصرف فرهنگی/مذهبی داشته باشد:
mavaez.ir, 2aha.ir, babolelm.ir, mahjoor.ir

دامنه‌هایی که می‌تواند مصرف شخصی/عمومی داشته باشد:
azizami.ir, 90blog.ir