إذا كنت مصمم ويب ، فإن الخطأ المعروف باسمربما واجهتك Viewpoint Scaling التي تحدث في أجهزة Apple ، أي iPod و iPhone و iPad. في بعض الأحيان ، عندما نقوم بتدوير جهاز Apple الخاص بنا من اتجاه عمودي إلى اتجاه أفقي ، يقوم الموقع بالتكبير ، مما يوضح لنا عرضًا له عرض أكبر من عرض الجهاز. وذلك لأن المصمم قام بتعيين عرض منفذ العرض على عرض الجهاز. لمساعدتك في الحصول على فكرة عن كيفية عمل هذا الخطأ ، قمنا بتصميم صفحة عينة وقمنا بتدوير iPad من صورة إلى عرض أفقي.
حل سريع لقالب يرشدنا لضبط"أقصى مقياس = 1" في علامة تعريف منفذ العرض. يعمل هذا على حل المشكلة في الوقت الحالي ولكن الصفحة لم تعد قابلة للتكبير لأننا نصلح الحد الأقصى للعرض المماثل لعرض الجهاز.
<meta name="viewport" content="width=device-width; initial-scale=1; maximum-scale=1">
هذا الإصلاح السريع ليس هو الحل الأمثل. من خلال العمل الجاد للمصممين مثلmathias وcheeaun و @ jdalton ، لدينا الآن جافا سكريبت يمكن إضافته إلى قسم <head> للحصول على حل دائم. تحت هذا الحل ، ستبقى الصفحة قادرة على التكبير.
<script type="text/javascript">
(function(doc) {
var addEvent = "addEventListener",
type = "gesturestart",
qsa = "querySelectorAll",
scales = [1, 1],
meta = qsa in doc ? doc[qsa]("meta[name=viewport]") : [];
function fix() {
meta.content = "width=device-width,minimum-scale=" + scales[0] + ",maximum-scale=" + scales[1];
doc.removeEventListener(type, fix, true);
}
if ((meta = meta[meta.length - 1]) && addEvent in doc) {
fix();
scales = [.25, 1.6];
doc[addEvent](type, fix, true);
}
}(document));
</script>هذه هي الحلول الوحيدة المعروفة التي توصل إليها المصممون حتى الآن. ولكن إذا كان لديك حساب آخر لإصلاح هذا الخطأ ، فقم بمشاركته معنا في التعليقات.
تعليقات