في هذه المقالة سنعرض لكم مجموعة من 20 اضافة للجي كويري jQuery تسمح لك بالتحكم الكامل في التيبوغرافي الذي تضعه في تصميمك، من خلال التحكم في موضعه ، اعادة ضبط حجمه ، …. وغيرها.

كما قمنا بإضافة عدد من الاضافات التي تسمح لك بإضافة تأثيرات حركية على نصوص تصميمك. بعض هذه الاضافات للتصميمات المتجاوبة ، وبعضها الآخر يساعدك في ابداع تأثيرات نصية رائعة.

 

1- FlowType.JS

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

 

2- Squishy

هي اضافة تفيدك في تغيير حجم النص بصورة تلقائية لتتناسب مع مساحة المنطقة المعروض بها ، اي انه يتناسب تماما مع التصميمات المتجاوبة.

فهو يأتي مع مجموعة من الخيارات وانت كل ما عليك هو التحكم في اعداداتها من : اقصى حجم ، اقصى عرض ، وكذلك اقل عرض.

 

3- slabText

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

 

4- FitText

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

 

5- responsiveText

عبارة عن اضافة تسمح لك بالتحكم في حجم الخط مستندا على نسب عرض تصميمك المتجاوب المتعددة.

 

6- TypeButter

تسمح لك هذه الاضافة في تعيين المسافات البصرية لأي خط موجود على موقع الويب الخاص بك. فهي تأتي على هيئة حزم مع انواع خطوط مثل : Arial, Georgia, Helvetica, Times and Verdana

لكن اذا ما اردت نوع خط آخر يمكنك بكل بساطة اضافته اليها.

 

7- Hatchshow

عبارة عن اضافة تسمح لك بضبط المسافات والهوامش بين الاسطر.

 

والآن نستعرض سويا الاضافات التي تسمح بإضافة تأثيرات حركية على التيبوغرافي:

 

8- Textillate.js

اضافة رائعة لتطبيق تأثيرات حركية بواسطة CSS3 على اي حقل نصي في التصميم. لكنك ستحتاج الى اضافتي lettering.js و animate.css لتتمكن من تطبيق هذه الاضافة بشكل كامل ورائع.

 

9- funnyText.js

تسمح لك هذه الاضافة بخلق جو مرح ولطيف على نصوص التيبوغرافي بموقعك. فتظهر لك تأثيرات مرحة اثناء مرورك بالماوس على النصوص.

 

10- Super Easy Text Rotator

تسمح لك بإضافة تأثير التدوير على نصوص محددة ترغب بإبرازها اما زوار موقعك. كل ما عليك هو :

وضع الكلمة التي ترغب في اضافة التأثير عليها بين <span></span> وافصل بينها بفاصلة (,) وسيقوم السكريبت بعمله تلقائيا .

 

11- Lettering.js

عملها يشبه لحد كبير ما تقوم به اضافة funnyText.js التي سبق وذكرناها بالاعلى ، لكن هذه الاضافة تسمح لك بإضافة تأثير حركي على النصوص للأسفل .

 

12- Jumble

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

 

اضافات تسمح لك بتدوير النصوص :

 

13- CircleType.js

وهي اضافة تسمح لك بوضع نص التيبوغرافي الذي تريده في اطار مستدير.

 

14- Bacon

تسمح لك هذه الاضافة بتدوير نص التيبوغرافي او لفه بزاوية ما ليوازي منحنى او خط موجود بتصميمك.

 

15- jQSlickWrap

تسمح لك هذه الاضافة بلف النص بكل سهولة ودقة حول المحتوى الموجود بموقعك او حتى حول الصور المعروضة.

 

اضافات تأثيرات حركية على النص :

 

16- No Vacancy

تعطيك هذه الاضافة امكانية جعل نص التيبوغرافي الخاص بك يتألق بتأثيرات نيون مضيئة.

 

17- Sci-Fi Text Effects

اضافة مميزة تعطي التيبوغرافي الخاص بك تأثيرا خيالا انيقا.

 

18- Flipping Text

تعطيك هذه الاضافة لمسة بسيطة على التيبوغرافي وكأنه يتم كتابته امام عينيك بصورة متسلسلة.

 

19- Antiquify.js

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

 

20- jQuery Typography Troll

تعمل هذه الاضافة على خلق جو من التشويش لدى قراء موقعك حيث تمزج عدد مختلف من الخطوط في كتابة النص. مثل : Helvetica و Arial بصورة عشوائية ليظهر لك كل حرف كتب من نوع مختلف .