ثانیه ها » jquery

اضافه کردن ترجمه یا ساب تایتل به ویدئو های خود در html5

صالح — Sun, 10 Jul 2011 23:06:24 +0000

یک پلاگین جی کوئری به اسم cue-points که با کمک html5 به شما این قابلیت رو میده که به ویدئو های خودتون ترجمه یا به عبارت درست (sub Title ) اضافه کنید.

نحوه کارش هم بسیار آسون هست. کافیست پس از ضمیمه کردن پلاگین به صفحه تون کد زیر را وارد کنید.


$(document).ready(function(){
  var slides = {5:"Hello World"}
  cuepoint.init(slides);
  cuepoint.play();
});

جهت دریافت پلاگین به اینجا مراجعه کنید

نحوه نصب و راهندازی jquery

صالح — Tue, 12 Feb 2008 16:25:55 +0000

در شروع کار با jquery اول باید jquery رو نصب کنیم. البته اصطلاح نصب درست نیست. اما چیزی جایگزین پیدا نکردم.
در مرحله اول نیاز هست شما آخرین نسخه کتابخانه jquery رو از سایت jquery.com دانلود کنید. کافیه وارد سایت بشید و در منو های بالای سایت گزینه دانلود رو انتخاب کنید.

در حالت کلی سه مدل برای دانلود وجود دارد :
۱- Minified : که خیلی فشرده شده و برای استفاده تجاری استفاده میشه و ۱۵ کیلوبایت هم می باشد.(به دلیل لود شدن سریع)

۲- Uncompressed : که به صورت غیر فشرده هست و حجمش حدود ۹۴ کیلو بایت می باشد. و برای توسعه یا فراگیری مورد استفاده قرار میگیرد.

۳- Packed : حجمی حدود ۲۹ کیلوبایت داره و به صورت gzip فشرده نشده

در حال حاضر آخرین نسخه jquery ورژن ۱.۲.۳ هست.

بعد از دانلود شما باید کتابخانه را در صفحات خود نصب کنید .

طریق نصب در صفحات همانند کد های زیر می باشد.

اما نحوه نوشتن کدها : در ۲ حالت ما میتونیم کدهای خودمون رو بنویسیم ۱. به صورت inline : یعنی کدها رو در همون صفحه تایپ کنیم. من پیشنهاد میدم از این روش کمتر استفاده کنید. و سعی کنید زمانی استفاده کنید که کد مربوز به همین صفحه باشه. اگر قرار کد یا تابعه ای که می نویسید در صفحات دیگر هم استفاده شوند. حتما از روش دوم استفاده کنید. ۲. به صورت external : در این حالت شما یک فایل با پسوند sample.js ایجاد میکنید. و تمامی کد های خود را در این فایل مینویسید. و سپس فایل sampale.js را در صفحات خود فراخوانی میکنید. بصورت زیر :







jQuery

و یک پیشنهاد دیگر سعی کنید تمام کد هاتون به صورت تابع نوشته بشه . تا بهینه تر بتونید استفاده کنید.

خوب ما موفق به نصب جی کوئری شدیم. فردا اولین کد خودمون را خواهیم نوشت

مقدمات یادگیری JQUERY

صالح — Mon, 11 Feb 2008 10:20:03 +0000

همینطور که میدونیم JQUERY یک کتابخانه جاوا اسکریپت هست . پس نیاز هست مقداری آشنایی با این زبان کلاینت ساید داشته باشید.

اما از همه مهمتر شما باید با تگ ها و المنت های html و xhtml آشنایی داشته باشیم. در این پست سعی می کنم موارد ضروری، که باید حتما بلد باشید رو مختصری توضیح میدهم!!

هر عنصر یا المنت می توانید دارای بخش های زیر باشد.

۱- صفات (Attribute’s) : شامل صفت هایی هستند که ما به عنصرهای داخل صفحات میدهیم. مانند title,dir,lang, hight,widthو
name ……

نکته : در خیلی از عنصر ها صفات خاص دارند یا صفاتی که در سایر عنصر ها هستند رو ندارند.

۲- شناسه یکتا ( ID ) : ما می توانیم به هر عنصر یک شناسه یکتا اختصاص بدیم تا بتونیم به راحتی از سایر عنر های هم نوع شناسایی و انتخاب کنیم

3- کلاس (class) : تعریف کلاس هم یک نوع شناسه هست. هم میتواند یکتا باشد. هم یکتا نباشد. و بیشتر در صفحاتی که بر پایه css طراحی می شود استفاده می شود.

4- سبک (style) : به کمک این صفت می توانید صفاتی که برای ظاهر عنصر مورد استفاده میگیرند رو در این صفت و inline قرار بدید

سوال اینجاست اینها به چه درد ما میخوره؟!

سوال خوبی هست. باید خدمتتون عرض کنم که برای کنترل عنصر ها توسط جاوا اسکریپت ما نیاز داریم که بتونیم عنصر مورد نظرمون رو سریع پیدا کنیم. راه های زیادی هست برای شناسایی. شاید سریع ترین راهی که مد نظرتون بیاد این هست که ما میتوانیم کل عنصر ها رو اسکن کنیم و عنر مورد نظر رو پیدا میکنیم. اما به نظر شما این کار درست و بهینه ای هست؟ شاید در صفحای که ما میخواهیم این کار رو انجام بدیم صدها عنصر همانند وجود داشته باشه؟ اونقت به نظر شما چه مقدار وقت باید صرف پیدا کردن عنصر مورد نظرمون بکنیم؟

در مطلب بعدی خواهیم دید که ما توسط jquery چه طور به کمک موارد بالا یعنی شناسه ها ، کلاسها یا نوع عنصر به راحتی عنصر مورد نظرمون رو پیدا خواهیم کرد.

JQuery (جی کوئری) چیست

صالح — Sat, 09 Feb 2008 22:35:29 +0000

JQuery یک فریمورک جاوا اسکریپت می باشد. اما اصلاً یک فریمورک چیست؟ و فقط مورد نیاز یک برنامه‌نویس است یا یک طراح وب هم می‌تواند از آن بهره ببرد؟

نمی‌دانم وقتی صحبت از فریمورک می‌شود چه تعریفی برای آن در ذهن دارید. بطور کلی می‌توان فریمورک را مجموعه‌ای از ابزارها، کتابخانه‌ها، قراردادها و بهترین شیوه‌ها تعریف کرد بطوریکه سعی می‌کنند وظایف روتین را به سوی مدل‌های جامعی سوق دهند که دوباره می‌توانند مورد استفاده قرار بگیرند. هدف این است که به یک طراح یا توسعه دهنده اجازه داده شود تا بر روی وظایفی که در انجام پروژه مهم هستند تمرکز کند. البته وقتی صحبت از فریمورک می‌شود الزاماً در مورد چیزی که ساخته شده، بصورت پکیج در آمده و برای عموم منتشر شده حرف نمی‌زنیم. چرا که ممکن است یک فریمورک منحصراً برای شما یا تیم شما باشد.(منبع الوان وب)

همینطور که در بالا توضیح داده شد. jquery یک کتابخانه از توابع آماده شده برای جاوا اسکریپت می باشد. در این زمینه فریمورک های دیگری هم وجود دارند. همانند Prototype و MooTools و فریمورک معروف یاهو با نام YUI .که هر کدوم از این فریمورک ها داری معایب و مزایای مختص خود هستند.

حالاچرا jquery ؟

کافیست مقداری در سایت های هر کدام از فرمورک ها نگاهی به کد نویسی و syntex هر فریمورک بیندازید. اینجاست که در همین مرحله ابتدایی شما jquery رو انتخاب میکنید. فقط به خاطر اینکه به راحتی با کمترین دانش برنامه نویسی میتوانید نحوه کد نویسی jquery رو درک کنید.

به همین دلیل jquery خیلی محبوب شد و شاهد رشد و توسعه عالی و سریع اون در ۱ سال گذشته شدیم. به نحوی که خیلی از برنامه ها و اسکریپت های تحت وب که برای خود اسم و نامی دارند. همانند wordpress و سایت های بزرگی چون یاهو و گوگل در قسمت هایی از کارهاشون از این فریمورک استفاده کرده اند.

یکی دیگر از مزایای این فریمورک وجود پلاگین های متعددی ایست که بسیار کار امد هستند . و روزانه در حال افزایش هست. به طوری که شاید نیازی به کد نوشتن پیدا نکنیم و همین پلاگین ها کار مورد نظر ما را به خوبی انجام بدن.

کاربرد های jquery :

یکی از کاربرد های مهم jquery داشتن دستورات بسیار راحت در زمینه بکار گیری تکنولوژِی ای جکس می باشد. به طوری که در ادامه سری آموزش jquery خواهید دید چقدر راحت می توانید یک وب سایت را با کمک jquery به صورت فول ای جکس طراحی کنید.

تا اینجا برای یک مقدمه مختصر کفایت میکنه .بقیه رو موکول میکنم به ادامه آموزش جی کوئری.