مجموعة من البرامج النصية jQuery من Dimox. نصوص JQuery جديدة للمطورين ما هو jQuery
jQuery هي مكتبة JavaScript تسمح لمطوري الويب بإضافة وظائف متقدمة إلى مواقعهم على الويب. إنه متاح ومتاح مجانًا بموجب ترخيص MIT. في السنوات الأخيرة، أصبحت jQuery مكتبة JavaScript الأكثر شيوعًا المستخدمة في تطوير الويب.
مثال مسجلتنفيذ jQuery، يحتاج مطور الويب إلى الإشارة إلى ملف JavaScript في كود HTML لصفحة الويب. تستضيف بعض مواقع الويب نسختها المحلية الخاصة، بينما يرتبط البعض الآخر ببساطة بمكتبة يستضيفها Google أو خادم. على سبيل المثال، يمكن لصفحة ويب تحميل مكتبة jQuery باستخدام السطر التالي في قسم HTML (مثال jQuery وملفات تعريف الارتباط):
أمثلة على jQuery وAjaxبمجرد تحميل المكتبة، يمكن لصفحة الويب استدعاء أي وظيفة تدعمها المكتبة. تتضمن الأمثلة الشائعة تغيير النص ومعالجة بيانات النموذج ونقل العناصر على الصفحة وتنفيذ الرسوم المتحركة. يمكن لـ jQuery أيضًا العمل مع كود Ajax وأمثال PHP وASP للوصول إلى البيانات من قاعدة البيانات. نظرًا لأن jQuery يعمل من جانب العميل (وليس خادم الويب)، فيمكنه تحديث المعلومات على صفحة الويب في الوقت الفعلي دون إعادة تحميل الصفحة. أحد الأمثلة الشائعة هو الإكمال التلقائي، حيث يعرض نموذج البحث البيانات العامة تلقائيًا عند إدخال استعلام.
فوائد المكتبةبصرف النظر عن ترخيصه المجاني، فإن السبب الرئيسي الآخر وراء اكتساب jQuery الكثير من الشعبية هو توافقه مع جميع المتصفحات. نظرًا لأن كل متصفح يعرض JavaScript بشكل مختلف، فقد يكون من الصعب على مطور الويب جعل موقع الويب يبدو بنفس الشكل عبر جميع المتصفحات. بدلاً من كتابة وظائف مخصصة لكل متصفح، يمكن لمطور الويب استخدام وظيفة jQuery واحدة ستعمل في Chrome وSafari وFirefox وInternet Explorer. لقد أدى دعم المتصفحات المتعددة إلى انتقال العديد من المطورين من JavaScript القياسي إلى jQuery لأنه يبسط عملية الترميز إلى حد كبير.
يتم استخدام بناء جملة jQuery لتبسيط التنقل بين المستندات واختيار عناصر DOM وإنشاء الرسوم المتحركة والتعامل مع الأحداث وتطوير تطبيقات Ajax. يمنح jQuery أيضًا للمطورين القدرة على إنشاء مكونات إضافية أعلى مكتبة JavaScript. فهو يسمح للمبرمجين بإنشاء تصميمات مجردة للتفاعل والرسوم المتحركة ذات المستوى المنخفض والتأثيرات المتقدمة والأدوات المصغّرة عالية المستوى. يتيح لك النهج المعياري لمكتبة jQuery إنشاء صفحات ويب وتطبيقات ويب قوية وديناميكية.
مجموعة من الوظائف الأساسية:
- اختيار عناصر DOM؛
- التجاوز والتلاعب باستخدام آلية الاختيار؛
- أسلوب برمجة جديد؛
- دمج الخوارزميات وهياكل بيانات DOM.
أثر هذا النمط على بنية أطر عمل JavaScript الأخرى مثل YUI v3 وDojo، كما ألهم إنشاء واجهة برمجة تطبيقات Selectors القياسية.
توفر Microsoft وNokia jQuery على منصاتهما. قامت Microsoft بتضمينه مع Visual Studio لاستخدامه ضمن ASP.NET AJAX وASP.NET MVC، كما قامت Nokia بدمجه في إطار عمل تطوير Web Time Widget.
jQuery عبارة عن مكتبة من العناصر ذات نموذج كائن المستند (DOM). DOM هو تمثيل للهيكل الشجري لجميع عناصر صفحة الويب. تعمل jQuery على تبسيط بناء الجملة للعثور على عناصر DOM واختيارها ومعالجتها. يمكن استخدام المكتبة للعثور على عنصر في مستند له خاصية معينة (على سبيل المثال، جميع العناصر ذات علامة h1)، أو تغيير واحدة أو أكثر من سماتها (اللون، أو الرؤية)، أو الاستجابة لحدث (على سبيل المثال، بنقرة ماوس).
تطويرتستخدم المكتبة ميزات JavaScript الشائعة مثل التلاشي والتلاشي لإخفاء العناصر والرسوم المتحركة والعمل مع عناصر jQuery CSS. يوفر jQuery أيضًا نموذجًا للتعامل مع الأحداث يتجاوز تحديد عناصر DOM ومعالجتها. يتم تعيين حدث وتحديد وظيفة رد الاتصال في خطوة واحدة في مكان واحد في الكود.
مبادئ التطوير باستخدام jQuery (أمثلة):
- فصل JavaScript وHTML - توفر المكتبة صيغة بسيطة لإضافة معالجات الأحداث إلى DOM باستخدام JavaScript، بدلاً من إضافة سمات أحداث HTML لاستدعاء وظائف JS. وبالتالي، فهو يشجع المطورين على فصل كود JavaScript تمامًا عن ترميز HTML.
- الإيجاز والوضوح - يعزز الإيجاز والوضوح باستخدام أدوات مثل التسلسل وأسماء الوظائف المختصرة.
- القضاء على حالات عدم التوافق بين المتصفحات - تختلف محركات JavaScript قليلاً بين المتصفحات، لذا فإن كود JS الذي يعمل مع متصفح واحد قد لا يعمل مع متصفح آخر. مثل مجموعات أدوات JavaScript الأخرى، تعالج jQuery جميع حالات عدم الاتساق هذه عبر المتصفحات وتوفر تجربة متسقة تعمل عبر المتصفحات.
- القابلية للتوسعة - يمكن بسهولة إضافة أحداث وعناصر وأساليب جديدة ثم إعادة استخدامها كمكون إضافي.
تم إصدار jQuery في الأصل في يناير 2006 في BarCamp NYC بواسطة John Resig وتأثر بمكتبة cssQuery المبكرة لـ Dean Edwards. تتم صيانته حاليًا من قبل فريق من المطورين بقيادة تيمي ويليسون (مع محرك محدد jQuery - Sizzle، بقيادة ريتشارد جيبسون).
تتضمن المكتبة الوظائف التالية:
- تحديد عناصر DOM باستخدام محرك التحديد متعدد الخوادم مفتوح المصدر Sizzle؛
- تسليط الضوء على مشروع معالجة DOM القائم على محدد CSS، والذي يستخدم أسماء العناصر وسماتها، مثل المعرف والفئة، كمعايير لاختيار العقد في DOM؛
- الأحداث؛
- التأثيرات والرسوم المتحركة.
- اياكس.
- الكائنات المؤجلة والوعدية للتحكم في المعالجة غير المتزامنة ؛
- تحليل JSON؛
- القابلية للتوسعة من خلال المكونات الإضافية؛
- المرافق مثل اكتشاف الميزات؛
- طرق التوافق المتوفرة أصلاً في المتصفحات الحديثة ولكنها تتطلب إصدارات سابقة، مثل inArray() وeach()، ومتصفح متعدد (يجب عدم الخلط بينه وبين المتصفحات المشتركة).
مكتبة jQuery عبارة عن ملف JavaScript واحد يحتوي على جميع وظائف DOM الشائعة والأحداث والتأثيرات وAjax. ويمكن تضمينها في صفحة ويب عن طريق الارتباط بنسخة محلية أو بإحدى النسخ العديدة المتوفرة على الخوادم العامة. تحتوي المكتبة على شبكة توصيل المحتوى (CDN) التي تستضيفها MaxCDN.
مثال jQuery في PHP:
لدى jQuery نمطين للاستخدام:
عادةً ما يبدأ الوصول إلى عقد DOM المتعددة ومعالجتها في JQuery باستدعاء الدالة $ باستخدام السلسلة، مما يؤدي إلى إرجاع كائن jQuery يشير إلى جميع العناصر المطابقة في صفحة HTML.
وضع خالي من الصراعيتضمن jQuery وضع .noConflict() الذي يطلق التحكم في ملف $. يعد هذا مفيدًا إذا تم استخدام jQuery مع مكتبات أخرى تستخدم أيضًا $ كمعرف. في الوضع الخالي من الصراع، يمكن للمطورين استخدام المكتبات كبدائل للدولار دون فقدان الوظائف.
يمكن تسجيل وظائف رد الاتصال للتعامل مع الأحداث على العناصر التي لم يتم تحميلها بعد ضمن .ready() كوظائف مجهولة. سيتم استدعاء هذه المعالجات فقط عند إطلاق الحدث. على سبيل المثال، تضيف التعليمة البرمجية التالية معالجًا للنقر بالماوس على عنصر صورة img:
$("img").on("انقر",function())(
// التعامل مع حدث النقر على أي عنصر img في الصفحة
تقوم بعض الوظائف بإرجاع قيم محددة (على سبيل المثال، $("#input-user-email").Val()). في هذه الحالات، لا يعمل التسلسل لأن القيمة لا تشير إلى كائن jQuery.
خلق عناصر جديدةبالإضافة إلى الوصول إلى عقد DOM من خلال التسلسل الهرمي للكائنات، من الممكن أيضًا إنشاء عناصر جديدة إذا كانت السلسلة التي تم تمريرها كوسيطة إلى $() تبدو مثل HTML. على سبيل المثال، يبحث السطر عن عنصر تحديد HTML مع بطاقات الهوية ويضيف عنصر خيار بالقيمة VAG والنص Volkswagen:
$("# حدد ماركات السيارات")
إلحاق($("")
أتر ((القيمة: VAG))
إلحاق (فولكس واجن)).
خدماتوظائف jQuery المسبوقة بـ $ هي وظائف مساعدة تؤثر على الخصائص والسلوك العام. يستخدم المثال التالي الدالة every()، والتي تتكرر عبر المصفوفات:
$.each(,وظيفة())(
console.log(this+1);
يكتب مثال نشر jQuery هذا 2، 3، 4 إلى وحدة التحكم.
اياكسمن الممكن تنفيذ Ajax باستخدام $.ajax() الخاص بـ jQuery، ومن الأمثلة على ذلك الطرق ذات الصلة لتحميل البيانات عن بعد ومعالجتها:
عنوان URL: "/العملية/submit.php"،
الاسم: جون
الموقع: بوسطن
)).تم(وظيفة(رسالة)(
تنبيه("البيانات المحفوظة:"+msg);
)).fail(function(xmlHttpRequest,statusText,errorThrown)(
يُحذًِر(
"لم نتمكن من إرسال رسالتك.\N\n"
+"طلب XML Http:"+JSON.stringify(xmlHttpRequest)
+ "،\nنص الحالة:"+نص الحالة
+ "،\nحدث خطأ:"+errorThrown);
في هذا المثال، يحتوي الخادم على dataname=John وlocation=Boston لـ /process/submit.php. عند اكتمال هذا الطلب، يتم استدعاء وظيفة لتنبيه المستخدم. إذا فشل الطلب، فسيتم تنبيه المستخدم بالخطأ وحالة الطلب والخطأ المحدد.
الإضافاتتسمح بنية jQuery للمطورين بإنشاء تعليمات برمجية قابلة للتوصيل لتوسيع الوظائف المختلفة. هناك الآلاف من المكونات الإضافية المتاحة عبر الإنترنت والتي تغطي مجموعة من الميزات مثل مساعدات Ajax، وخدمات الويب، والقوائم الديناميكية، وأدوات XML وXSLT، والسحب والإفلات، والأحداث، ومعالجة ملفات تعريف الارتباط، والنماذج.
هناك مكونات إضافية بديلة لمحركات البحث، مثل jquer.in، والتي تتبع أساليب أكثر تخصصًا، مثل إدراج المكونات الإضافية التي تلبي معايير معينة فقط (على سبيل المثال، تلك التي تحتوي على مستودع كود عام). يوفر المطور مركز التعلم، وهو مورد jQuery للمبتدئين والذي يمكنه مساعدة المستخدمين على فهم JavaScript والبدء في تطوير المكونات الإضافية.
واجهة مستخدم مسجjQuery UI عبارة عن مجموعة من عناصر واجهة المستخدم الرسومية والمرئيات المتحركة والموضوعات التي يتم تنفيذها باستخدام jQuery CSS (مكتبة JavaScript) وCascading Style Sheets وHTML. وفقًا لخدمة تحليلات JavaScript Libscore، يتم استخدام jQuery UI من قبل أكثر من 197000 من أفضل مواقع الويب، مما يجعلها ثاني أكثر مكتبات JS شعبية. وأشهرها: Pinterest، وPayPal، وIMDb، وThe Huffington Post، وNetflix.
واجهة المستخدم jQuery مجانية ومفتوحة المصدر، وتوزعها المؤسسة بموجب ترخيص MIT. تم نشره لأول مرة في سبتمبر 2007.
مسج موبايلjQuery Mobile هو إطار عمل ويب محسّن باللمس (يُعرف أيضًا باسم إطار عمل الهاتف المحمول). ينصب التركيز الرئيسي للتطوير على إنشاء بنية تحتية متوافقة مع مجموعة واسعة من الهواتف الذكية وأجهزة الكمبيوتر اللوحية، الضرورية لسوق التكنولوجيا الرقمية المتنامي. متوافق مع منصات تطبيقات الهاتف المحمول الأخرى مثل PhoneGap وWorklight وغيرها الكثير.
قبل 10 سنوات، عندما كانت jQuery في بداياتها، كان النظام البيئي للمتصفح متنوعًا للغاية وكان كل منتج من المنتجات الموجودة في ذلك الوقت يعاني من تعقيد إدارة عناصر DOM. كان الهدف الطموح الذي حدده مطورو jQuery لأنفسهم هو تطوير نهج عالمي لحل هذه المشكلات وإنشاء واجهة برمجة تطبيقات تعمل بشكل جيد في أي موقف.
بقدر ما تمكنوا من الحكم، ولكن بعد 10 سنوات من وجودها، تظل jQuery واحدة من مكتبات JavaScript الأكثر شعبية.
أصبحت JavaScript نفسها الآن منتجًا ناضجًا تمامًا، وموثقة جيدًا ومدعومة من قبل جميع المتصفحات الحديثة. أصبح مجتمع المتصفحات الحديث أيضًا أكثر توحيدًا، وفي معظم الحالات، يمكنك التأكد من أنه إذا تم عرض الصفحة بشكل صحيح في Crome، فستبدو كما هي في Firefox. يتم دعم querySelectors أيضًا في جميع المتصفحات الحديثة تقريبًا.
يبدو أن تاريخ تطوير jQuery يقترب من نهايته - لماذا يتم التحميل الزائد للصفحات وإهدار دورات المعالج الإضافية إذا كان من الممكن حل معظم المشكلات باستخدام أدوات اللغة القياسية؟ من ناحية أخرى، خلال هذه الفترة الطويلة لصناعة الكمبيوتر، تم تطوير عدد كبير من الحلول التي يمكن ببساطة أخذها واستخدامها هنا والآن.
أعتقد أن هذا الاختيار يجب أن يتخذه المطور نفسه في كل موقف محدد، مع التركيز ليس على الموضة والاتجاهات، ولكن على الحس السليم وآفاق تطوير إبداعه.
في هذه المراجعة، قمت بجمع كافة المكونات الإضافية المجانية لـ jQuery التي أعرف أنها قيد التطوير حاليًا أو التي تم تحديثها مرة واحدة على الأقل خلال العام الماضي. البعض منهم أستخدمه بنشاط وأستخدمه في ممارستي، وبعضهم أعرفه بشكل سطحي فقط، لكنهم أبهروني بقدراتهم. من بينها هناك أشياء غير عادية بشكل استثنائي، مصنوعة بخيال عظيم. وحتى إذا لم تجد طريقة لاستخدامها في مشاريعك، فربما ستلهمك لإنشاء حلولك الخاصة والأكثر روعة.
multiscroll.js حل مثير للاهتمام لجذب انتباه الزائر - يتم تمرير الصفحة على شكل لوحتين، تنزلق إحداهما لأعلى والأخرى لأسفل، مما يفتح الكتلة التالية. كما أنه يعمل بشكل رائع على جميع المتصفحات، حتى المتصفحات القديمة جدًا.
مكون إضافي أصلي للغاية وأعتقد أن الزائرين سيحبونه إذا كان لديك الكثير من المواد النصية الطويلة.
من المؤكد أنك سمعت عن مكتبة جافا سكريبت الرائعة التي تسمى jQuery. ما هو بالضبط مسج؟
كيف تجعل حياة مطور الويب أسهل؟ من أين نبدأ؟ jQuery يجعل كتابة جافا سكريبت ممتعة وسهلة. باستخدام هذه المكتبة، يمكن تنفيذ العديد من جوانب Javascript المعقدة إلى حد ما بسهولة في أي تطبيق.
سيخبرك درس اليوم بكيفية البدء باستخدام jQuery وكيفية كتابة البرنامج النصي الأول.
ما هو مسج؟
jQuery هي مكتبة جافا سكريبت خفيفة الوزن للغاية (يسميها البعض إطار عمل) والتي تريحك من كتابة كود جافا سكريبت. يحتوي على الكثير من الميزات القوية جدًا، مثل تتبع DOM، وإضافة تأثيرات جميلة ورسوم متحركة إلى العناصر، وتقنيات وأساليب Ajax فائقة البساطة. وفي الصفحة الرئيسية لموقع jQuery أدق وصف برأيي:
jQuery هي مكتبة سريعة وموجزة تعمل على تبسيط التعامل مع الأحداث والرسوم المتحركة وتفاعل Ajax لتطوير الويب بشكل أسرع. تم تصميم jQuery لتغيير طريقة كتابة JavaScript.
ما هي فوائد مسج؟
دعونا نلقي نظرة سريعة على بعض مزايا وخصائص هذا الإطار:
يتم تقليل كمية التعليمات البرمجية (المطلوبة لتشغيل البرنامج النصي) بشكل كبير مقارنة بجافا سكريبت، وهذا بدوره يعني قضاء وقت أقل وتعليمات برمجية أكثر قابلية للقراءة. في وقت لاحق من المقالة سيتم مناقشة بعض الأمثلة.
أسهل بكثير في فهم التعليمات البرمجية (على عكس JavaScript). في عالمنا، كلما انتهيت من عملية البرمجة مبكرًا، كلما تمكنت من تخصيص المزيد من الوقت لأهداف أخرى.
وثائق مريحة للغاية ومجتمع نشط، مستعد دائمًا للمساعدة إذا لزم الأمر.
يصبح استخدام Ajax أسهل بكثير. ما عليك سوى 5 أسطر من التعليمات البرمجية (أحيانًا أقل) لإنشاء طلب Ajax بسيط.
عدد كبير من المكونات الإضافية التي يمكنك من خلالها فعل أي شيء تقريبًا.
مسج ممتع :)
كيف تبدأ؟
أولاً، تحتاج إلى زيارة الصفحة الرئيسية لموقع jQuery الرسمي وتنزيل أحدث إصدار من إطار العمل هذا. بعد التنزيل، تحتاج إلى تحميل هذا الملف إلى الاستضافة الخاصة بك، وكتابة رابط لهذا الملف في رأس المستند.
وبدلاً من ذلك، يمكنك الاستعانة بمساعدة Google الرائعة ووضع رابط لخادمهم، حيث توجد دائمًا أحدث الإصدارات من أي أطر عمل. يمكن العثور على الرابط الضروري.
هل الوثيقة جاهزة؟
لتنفيذ برنامجنا النصي jQuery الأول، نحتاج إلى تغليف البرنامج النصي بأكمله في دالة. سيتم تنفيذ هذه الوظيفة عندما يكون DOM جاهزًا تمامًا (عندما يكون "المستند جاهزًا" - ترجمة حرفية من الإنجليزية). لاحظ أن هذا مشابه جدًا لحدث "onload" الشائع، ولكنه ليس هو نفسه. لنلقي نظرة على مثال:
$(document).ready(function())( // الكود هنا ));
أعلاه نطلب من jQuery تنفيذ أي تعليمات برمجية داخل الوظيفة، مع أن يكون DOM جاهزًا تمامًا. وهذا له مميزاته، على الرغم من أنه قد لا يكون واضحًا للكثيرين. أولاً، باستخدام هذه التقنية، نقوم بفصل Javascript عن HTML تمامًا. ثانيًا، لا نحتاج إلى الانتظار حتى يتم تحميل الصفحة بالكامل، فنموذج DOM يكفي للتحميل.
بالنسبة للمبرمجين الكسالى، أو لأولئك الذين يحسبون كل حرف، يمكنك اختصار الكود أعلاه:
$(function())( // الكود هنا ));
أول برنامج نصي لـ jQuery
نحن نعرف بالفعل كيفية الرجوع إلى المكتبة. نحن أيضًا نفهم قليلاً عن وظيفة document.ready. الآن حان الوقت لكتابة نص بسيط.
دعونا نجعل الأمر بسيطا قدر الإمكان. في هذا المثال، لنقم بإنشاء صفحة تحتوي على نص واقتباس في النهاية. نريد إظهار الاقتباس فقط إذا قام المستخدم بالنقر فوق الزر. ألق نظرة أدناه على الكود المطلوب لهذا:
$(مستند).جاهز(وظيفة())(
var myQuote = $("#my_quote");
hide();
$(".زر").انقر(وظيفة())(
myQuote.show(500);
});
});
دعونا نلقي نظرة فاحصة على الكود بأكمله.
كما ذكرنا سابقًا، قمنا بوضع كافة التعليمات البرمجية المراد تنفيذها داخل الدالة $document.ready().
نقوم بتعيين معرف عرض الأسعار الخاص بنا (my_quote) لمتغير myQuote. الآن لدينا إمكانية الوصول إلى الاقتباس بالمعرف my_quote.
هذا كل شئ. عند الضغط على الزر لمدة 0.5 ثانية، سيتم عرض الاقتباس. من السهل جدا، أليس كذلك؟
يتبع....
شكرًا لكم على اهتمامكم! أتمنى لك كل خير!
وهي واحدة من مكتبات جافا سكريبت الأكثر شعبية. وهذا ليس مفاجئا لمن يستخدمه. فهو يسمح لك بتبسيط وتسريع، والأكثر إثارة للدهشة، تحسين تطوير برامج JavaScript النصية.
مزايا :
- عمل مريح للغاية مع العناصر القائمة على محددات CSS.
- توافق ممتاز عبر المتصفحات. لا يفكر العديد من المبرمجين في التوافق عبر المتصفحات، ولكنه ضروري، لأن المتصفحات المختلفة يمكنها معالجة نفس الكود بشكل مختلف. يأخذ في الاعتبار كل هذه الفروق الدقيقة، ولم تعد بحاجة إلى التفكير في الأمر.
- قدرات الرسوم المتحركة ممتازة. الرسوم المتحركة تزين الصفحة وتجعل استخدامها أكثر متعة. من المستحيل ببساطة جعل الرسوم المتحركة أسهل مما يتم تنفيذه في . فهي تتمتع بإمكانيات هائلة مع سهولة الاستخدام.
- عدد كبير من الإضافات الجاهزة. قد يستغرق الأمر عدة أيام لإنشاء نفس شريط تمرير الصورة في JavaScript. ويمكنك تثبيت وتكوين مكون إضافي جاهز في بضع دقائق.
وعلى هذا يجب أن يعرف كل من يقوم بتطوير البرامج النصية في JavaScript. والغرض من هذه الفئة هو تعليمك كيفية الاستخدام، وكذلك إظهار أمثلة للاستخدام، على سبيل المثال، من ممارستي الخاصة.
بعد قراءة المقالات على jQuery، سوف تتعلم:1) كيفية التثبيت .
2) ما هي الدالة $() في .
3) كيفية اختيار العناصر في .
4) كيفية العمل مع أخذ العينات على .
5) كيفية إضافة وإزالة العناصر في .
6) كيفية معالجة الأحداث على .
7) كيف يتم عمل الرسوم المتحركة على ملفات .
8) كيفية تكبير الصور .
9) كيفية إنشاء زر "العودة إلى الأعلى" بسلاسة على .
10) كيفية تحميل الملفات ديناميكيًا إلى الخادم.
11) كيف يتم التخطيط التكيفي على .
12) كيفية إرسال طلبات غير متزامنة إلى
13) كيفية إرسال طلبات Ajax باستخدام طريقتي $.post() و $.get()
14) كيفية عمل زر اختيار على شكل شريط تمرير .
15) كيفية تثبيت شريط التمرير البقعة.
16) كيفية عمل أرشيف باستخدام البرنامج المساعد لملفات .
17) كيفية القيام بجولة في الموقع .
18) كيفية عمل علامات تبويب جميلة باستخدام JQuery.
19) كيفية إنشاء التسميات التوضيحية على موقع ويب باستخدام مكون إضافي لـ .
20) كيفية إنشاء شريط تقدم جميل باستخدام مكون إضافي لـ .
21) كيفية عمل قفل باستخدام قالب على .
22) كيفية إضافة مكبرات الصوت إلى موقع على شبكة الإنترنت مع مكتبة dynamo.js.
23) كيفية عمل فيديو في الخلفية باستخدام .
24) كيفية تأكيد إرسال البريد إلى .
25) كيفية عمل سلايدر جميل وفعال باستخدام JQuery.
26) كيفية عمل قائمة منسدلة جميلة على .
27) كيفية عمل نافذة منبثقة جميلة في JQuery باستخدام WebUI-Popover.
28) كيفية عمل إشعارات جميلة في JQuery باستخدام البرنامج المساعد Noty.
29) كيفية إنشاء قائمة منسدلة جميلة ذات تأثير مثير للاهتمام باستخدام CSS و.
30) كيفية عمل خلفية جسيمية على .
31) كيفية عمل مقارنة تفاعلية بين صورتين باستخدام JQuery.
32) كيفية عمل شريط تمرير دائري في مسج.
33) كيفية عمل السحب باستخدام JQuery.
34) كيفية عرض الوقت المنقضي منذ نشر منشور على .
35) كيفية عرض الأحرف الخاصة في مسج.
36) كيفية عمل عداد للعد التنازلي في المسج.
37) كيفية عمل قائمة مخصصة باستخدام مسج.
38) كيفية عمل الرسوم المتحركة عند تحميل الصفحة .
40) كيفية عمل قائمة منزلقة باستخدام JQuery.
41) JQuery LightGallery - البرنامج المساعد لإنشاء المعارض.
42) كيفية التفاف عنصر في المتصفح أو تخطيط الجهاز على .
43) كيفية عمل معرض جميل مع الفرز باستخدام JQuery.
44) كيفية عمل كائن ثلاثي الأبعاد تفاعلي باستخدام JQuery.
45) كيفية عمل نافذة منبثقة باستخدام JQuery.
46) كيفية عمل تأثير المنظر التمريري.
47) كيفية عمل قائمة همبرغر باستخدام CSS وJS. الجزء 1.
48) كيفية عمل قائمة همبرغر باستخدام CSS وJS. الجزء 2.
49) كيفية عمل نافذة منبثقة انقر فوق البحث.
50) كيفية التحقق من صحة النموذج باستخدام مسج.
51) كيفية عمل قناع إدخال للهاتف باستخدام jQuery.
52) كيفية العمل مع مكتبة مسج.
53) كيفية العمل مع مكتبة jQuery UI.
54) كيفية استخدام jQuery UI Slider.
55) كيفية استخدام القطعة jQuery UI Datapicker.
56) حول البرنامج المساعد لعلامات التبويب EasyTabs.
57) كيفية تخصيص شريط التمرير BxSlider.
58) كيفية وضع مؤقت للعد التنازلي على موقع على الانترنت.
59) كيفية عمل نموذج AJAX دون إعادة تحميل الصفحة.
60) كيفية إنشاء تأثير النص المطبوع على موقع على شبكة الانترنت.
61) استخدام مثال حقيقي عن الرسوم المتحركة لمتجه SVG.
62) المرشحات في مسج.
63) كيفية الحصول على محدد في مسج.
64) كيفية التعامل مع السمات في مسج.
65) كيف تعمل أحداث الماوس jQuery.
66) كيف تعمل تأثيرات مسج.
67) كيفية القيام (جزء 1).
68) كيفية عمل نافذة منبثقة باستخدام jQuery (الجزء 2).
69) كيفية التصفية حسب الحروف الأولى باستخدام مسج.
70) كيفية تحريك زر قائمة الهامبرغر.
71) كيفية عمل قائمة همبرغر سريعة الاستجابة.
72) كيفية عمل التصميم الأول للجوال.
73) كيفية عمل مرساة سلسة باستخدام مسج.
74) كيفية تمرير الصفحة لأعلى.
75) كيفية عمل القطعة الأكورديون للمكتبة.
يمكن القول أن هذا هو نوع من المنشور الأخير لما تمكنت من "طهيه" أثناء الحفاظ على هذه المدونة باستخدام إطار عمل jQuery الرائع.
- - خياران عالميان بسيطان للغاية لإنشاء مفاتيح علامات التبويب. مثال في الشريط الجانبي.
- — في الوقت الحالي، يوجد المثال العملي في الجزء العلوي الأيمن أسفل نموذج البحث. أفكر في إزالة هذه الميزة من المدونة. أتساءل عما إذا كان أي شخص يستخدمه بالفعل؟
- - برنامج نصي يغير حجم خط الصفحة حسب حجم نافذة المتصفح. بالنسبة لنفسي، لم أجد بعد استخدامًا لهذا البرنامج النصي في أي مكان.
- — تظهر معاينة أسفل النموذج لإضافة تعليق أثناء الكتابة. يمكنك إرفاقه بأي موقع باستخدام النموذج.
- - تظهر المعاينة عند النقر فوق الزر المقابل ويتم عرضها بدلاً من حقل النص. وفي رأيي أن هذا الحل أجمل من الخيار الأول. يمكن أيضًا إرفاق هذا البرنامج النصي بأي موقع ويب.
- . هذا البرنامج النصي مخصص لمستخدمي واجهة الويب Twitter ومحبي متصفح Opera. على الرغم من أنني أعتقد أن هناك طريقة لإرفاقه بالمتصفحات الأخرى.
- — بناءً على الخيار الثاني أعلاه، قمت بإنشاء هذا البرنامج المساعد. أنا حقا أحب الطريقة التي تحول بها. حتى الآن، تم تنزيله حوالي 8 آلاف مرة.
- — مكون إضافي مشابه للمكون السابق، فقط لصفحة إنشاء/تحرير المنشور في لوحة الإدارة.
- - هذا مخصص لأولئك الذين يعرفون كيفية توصيل البرامج النصية لـ UserJS بمتصفحهم. نموذج تسجيل دخول منبثق مناسب.
- - تظهر للزائر رسالة ترحيب بجوار نموذج إضافة التعليق إذا كان قد ترك تعليقاً مرة واحدة على الأقل.
- - الفكرة مستعارة من حبرابر. من المنطقي وضعه عند تكوين مواضيع مناقشة كبيرة في تعليقات الموقع.
— عندما تقوم بالتمرير فوق رابط ما، تظهر قائمة بالارتباطات لحفظ الصفحة في الإشارات المرجعية الاجتماعية. عند النقر على الرابط "إضافة إلى الإشارات المرجعية"، يمكنك التبديل بين قائمة خدمات الإشارات المرجعية والشبكات الاجتماعية. لسوء الحظ، ليست كل الشبكات الاجتماعية التي أضفتها إلى القائمة موجودة في الوقت الحالي.
لقد تخليت مؤخرًا عن هذا البرنامج النصي لصالح حل أكثر جمالًا - لقد قمت بإنشاء لوحة عائمة، والتي يمكنك رؤيتها الآن على يسار المنشور. أنا أحب هذا الخيار أكثر، وهو أكثر انسجاما مع الاتجاهات الحديثة. ربما سأكتب منشورًا حول إنشاء مثل هذه اللوحة.
- هذا مخصص لمستخدمي WordPress الذين لديهم وظيفة التخزين المؤقت من Maxim.
يحتوي البرنامج النصي على خطأ في UTF-8 - إذا كتبت الاسم بأحرف روسية عبر FireFox، فسيتم إدراج الأحرف من ملف تعريف الارتباط بطرق سيئة. تم اقتراح حل في التعليقات، لكن لم ينجح أي شيء بالنسبة لي.
— الواجهة تعمل باستخدام jQuery، والترجمة تعمل باستخدام Google API.
لقد توصلت إلى حل ناجح وشائع جدًا - تحتل أداتي حاليًا باستمرار المركز الثاني في قائمة أكثر التطبيقات التي تم تنزيلها، وهذا خبر سار.
واثنين من نصوص jQuery الإضافية التي لم أكتب عنها في أي مكان، ولكن يتم استخدامها في هذه المدونة:
- اقتباس تعليق - إذا حددت أي جزء من النص في التعليقات، فستنبثق لوحة بها رابط "أدخل اقتباس في حقل الإجابة" بالقرب من التحديد عند النقر فوقه، وسيتم إدراج النص المحدد في النموذج لإضافة تعليق.
- التحقق من صحة حقلي "الاسم" و"البريد الإلكتروني" في النموذج الخاص بإضافة تعليق. إذا تم ملء أحد هذه الحقول بشكل غير صحيح، فسيتم تمييزها.
هنا قائمة كبيرة. أعتقد أنه سينمو أكثر بمرور الوقت - فأنا أحب jQuery حقًا وعملية كتابة البرامج النصية عليه.
بشكل عام، jQuery بالنسبة لي هي المرحلة التالية في تطوري كمطور ويب، بعد CSS وHTML. إذا كنت بالفعل قويًا جدًا في التقنيتين الأخيرتين وليس هناك مكان للتحرك فيه، فإن jQuery، كما يقولون، حقل غير محروث، وهناك مجال للذهاب في هذا الاتجاه.
ينشر Blogger Max1mus على مدونته الشخصية الطرق الحالية لكسب المال على الإنترنت، ومعلومات مفيدة حول التدوين، وSEO، وSMO، ويشارك أيضًا تجربته الشخصية في الترويج لموقع الويب.