الصور المستجيبة أصبحت سهلة مع ResponsifyJS

يجب أن تكون الشبكة الحديثة سريعة الاستجابة بنسبة 100٪ وأن تجعل المكتبات الحديثة هذا الأمر ممكنًا بشكل متزايد.

مع الإضافات المجانية ، مثل ResponsifyJS, من الأسهل تشغيل مواقع الويب الخاصة بك على جميع الأجهزة. هذه البرنامج المساعد jQuery مجانا يأخذ حاوية من الصور و إعادة ترتيب بشكل حيوي لهم بناء على أحجام مختلفة للشاشة.

منذ حاويات مختلفة امسك الصور بشكل مختلف, يمكنهم تغيير حجم بطرق غريبة جدا. في بعض الأحيان ، سيكون لديك صور لأشخاص ويمكن أن تقطع وجوههم عند تغيير حجمها على الهاتف المحمول.

تم إنشاء البرنامج المساعد Responsify لحل هذه المشكلة بالضبط. يمكن أن تعمل تلقائيا ولكن السحر الحقيقي يكمن في تحديد مجال التركيز الخاص بك على الصورة.

ويستخدم النظام الداخلي للأوصاف العشرية للعثور على مكان تركيز الصورة. على سبيل المثال ، يمكنك ذلك تحديد المواقف مثل بيانات التركيز أعلى التي “كتل في” جزء معين من الصورة.

هذه البيانات تحتاج إلى تمرير في شكل الكسور العشرية, على سبيل المثال ، تستهدف العلامة العشرية 0.5 نسبة 50٪ من الصورة (يسار / يمين أو أعلى / أسفل). بطبيعة الحال ، هذا أمر مربك للغاية لتفعله بنفسك. ولكن ، هناك استجابة التطبيق مجانا هذا يتيح لك حساب المواقف بشكل حيوي في متصفحك.

كل ما عليك هو تحميل صورة ، وتحديد منطقة التركيز ، ثم نسخ / لصق رمز الصورة في موقع الويب الخاص بك. سيكون لدى المساعد Responsify جميع البيانات التي يحتاجها لتغيير حجم الصورة بشكل صحيح على شاشات أصغر.

يمكنك العثور على عدد غير قليل الروابط التجريبية الحية في GitHub repo ، بما في ذلك مقتطفات الكود لنسخها / لصقها في موقعك.

هذا البرنامج المساعد ليس هو الحل الأمثل لكل مشروع. في بعض الأحيان ، سوف تريد الصور لتغيير حجمها دون مجالات التركيز الثابتة. ولكن ، إذا كنت تستخدم شبكات البناء مع مسج لا يضر لإضافة ResponsifyJS إلى المكدس الخاص بك.

لمعرفة المزيد ، تفضل بزيارة الصفحة الرئيسية للمكون الإضافي للحصول على عرض توضيحي مباشر ، ورابط تنزيل ، ودليل إعداد كامل.