گاهی اوقات زمانی که در حال توسعه اپلیکیشن‌های وب برای موبایل هستید، ممکن است بخواهید قابلیت زوم دوبار ضربه‌ای را در مرورگرهایی مانند سافاری غیر فعال کنید. این ویژگی زمانی کاربرد دارد که می‌خواهید کاربران بدون هیچگونه وقفه‌ای از محتوای شما استفاده کنند. برای مثال وقتی که در حال طراحی یک بازی یا یک تجربه تعاملی هستید که در آن زوم کردن می‌تواند تجربه کاربری را به شدت تحت تأثیر قرار دهد.
یکی از روش‌های متداول برای غیر فعال کردن این ویژگی، جلوگیری از وقوع رویداد پیش‌فرض با استفاده از جاوا اسکریپت است. با استفاده از افزودن رویداد به عناصر خاصی یا حتی به کل صفحه می‌توانید مانع زوم شدن صفحه شوید. این راهکار در صورتی موثر است که روی طراحی واکنش‌گرا تمرکز کرده باشید و محتوای شما به خوبی در سایزهای مختلف صفحه نمایش دهید.
اما یکی دیگر از روش‌های مشهور استفاده از متا تگ در HTML است. این متا تگ به مرورگر می‌گوید تا جلوی زوم دوبار ضربه‌ای را بگیرد. این روش به سادگی قابل اجرا است و نیازی به هندل کردن رویدادها یا نوشتن جاوا اسکریپت ندارد.
علاوه بر این‌ها، استفاده از ویژگی‌های CSS و ایونت لیسنرهای جاوا اسکریپت نیز راه‌هایی برای کنترل رفتار زوم در مرورگرهای موبایل ارائه می‌دهد. هر کدام از این روش‌ها کاربرد خاص خود را دارد و باید براساس نیاز پروژه انتخاب شود.
استفاده از متا تگ
یکی از سریع‌ترین و ساده‌ترین روش‌ها استفاده از متا تگ زیر است که در بخش <head> سند HTML شما قرار می‌گیرد:
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" >
توضیحات متا تگ
<meta name="viewport": این خط تعیین می‌کند که تنظیمات خاصی مرتبط با viewport اعمال می‌شود.
content="width=device-width": عرض صفحه را به عرض دستگاه تنظیم می‌کند تا به خوبی نمایش یابد.
initial-scale=1: بزرگ‌نمایی اولیه صفحه را روی ۱ قرار می‌دهد.
maximum-scale=1: مانع از بزرگ‌نمایی بیش از حد می‌شود.
user-scalable=no">: این بخش مانع از این می‌شود که کاربر بتواند زوم کند و یکی از مهم‌ترین عوامل در غیرفعالسازی زوم دوبار ضربه‌ای است.