Skip site navigation پرش ناوبری سایت

    * Home خانه
    * All Articles همه مقالات
    * Tutorials خودآموزها
    * Freebies Freebies
    * About در باره
    * Contact تماس
    * Subscribe: RSS Feed اشتراک در : خوراک آر اس اس
    * Follow on Twitter در توییتر دنبال کنید

0diggsdigg
Learning MooTools: 20 MooTools Tutorials and Examples MooTools آموزش : 20 MooTools خودآموزها و نمونه

June 19th, 2008 by Jacob Gube | 35 Comments | Stumble It! Delicious 2008 ژوئن 19 Gube توسط یعقوب | 35 نظر | این خوردن! (خوشمزه)

Activate Your Free Account Today! eConnect Email is simply, email done better.

Become a Facebook Fan of Six Revisions . اشتراک فن فیس بوک از بررسی شش .

There are literally over a hundred of JavaScript frameworks out there that make writing complex client-side code significantly easier. به معنای واقعی کلمه وجود دارد بیش از 100 از چهارچوب های جاوا اسکریپت خارج وجود دارد که باعث نوشتن مجموعه کد های سمت سرویس گیرنده قابل توجهی آسانتر می کند. If you're in the market for a powerful, relatively lightweight, and customizable JavaScript framework, MooTools is worth checking out. اگر شما سبک وزن هستید در بازار قدرتمند ، نسبتا ، و قابل تنظیم چارچوب جاوا اسکریپت ، MooTools ارزش وارسی میکنن.

To help you get on your way to developing highly-interactive web applications using MooTools, here's 20 tutorials and working examples that's worth a read . برای کمک به شما MooTools گرفتن خود را در راه بسیار تعاملی وب در حال توسعه با استفاده از برنامه های کاربردی ، در اینجا 20 آموزش و کار نمونه که ارزش خواندن.
Getting Started with MooTools آغاز به کار با MooTools
1. The "Mootorial" 1. Mootorial ""

Mootorial -- عکس

The Mootorial at //clientside is a comprehensive, practical tutorial on the MooTools framework. Mootorial در / / clientside جامع ، آموزش عملی در چارچوب MooTools است. The tutorial allows you to execute the sample code either by Firebug or the website's built-in console. خودآموز به شما اجازه اجرا کد نمونه یا توسط اتش افروز و یا وب سایت ساخته شده در کنسول.
2. MooTools Overview Video Tutorial 2. MooTools بررسی اجمالی فیلم خودآموز

Here's an excellent screencast that introduces the MooTools framework. در اینجا screencast عالی است که به معرفی چارچوب MooTools. It covers the basics such as the concept of chaining, customizing MooTools to your needs, and where to find documentation for MooTools code. این اصول را پوشش می دهد مانند زنجیری شدن این مفهوم ، سفارشی MooTools به نیازهایتان داشته باشید و هر کجا که امکان پیدا کردن کد MooTools.
3. Increasing User Experience With Javascript 3. افزایش تجربه کاربر با جاوا اسکریپت

افزایش تجربه کاربر با جاوا اسکریپت -- عکس

Beauty By Design provides a nine-part video series on improving user interaction using JavaScript (primarily MooTools). زیبایی با طراحی فراهم می کند 9 قسمتی از سری فیلم بر بهبود تعامل با کاربر با استفاده از جاوا اسکریپت (در درجه اول MooTools). A couple of topics covered in the lessons include: using mooTabs, creating sliding sub menus, and using Fx.styles to control font size. زن و شوهر از موضوعات مطرح شده در درس عبارتند از : استفاده از mooTabs ، ایجاد منوهای کشویی زیر ، و استفاده از Fx.styles برای کنترل اندازه ی فونت.
4. Understanding Mootools Selectors 4. Mootools درک انتخابگرهای

One of the most powerful features of MooTools (as well as other frameworks/libraries like jQuery and Prototype) is the ability to easily select page objects for you to work on. یکی از ویژگی های قدرتمند MooTools (و همچنین چارچوب های دیگر / کتابخانه ها مثل jQuery و نمونه اولیه) توانایی را انتخاب کنید تا به راحتی اشیاء شما را به صفحه ای برای کار بر روی است. This tutorial covers the basics of selectors in MooTools: $(), $$(), $E(), and $ES() functions. این آموزش شامل مبانی انتخابگرهای در MooTools : $ () ، $ $$()، الکترونیکی () ، دلار و بنیادی () توابع.
5. MooTools MooTools Classes: How to use them 5. MooTools کلاسهای MooTools : چگونه می توان از آنها استفاده

This tutorial is an entry-level introduction on working with classes in MooTools. این آموزش در سطح مقدماتی ورود در کار با کلاسها در MooTools است. The tutorial works with a hypothetical scenario (buying a car from a car store) to illustrate the concept of classes. با این نسخهها کار میکند خودآموز سناریوی فرضی (خرید خودرو از فروشگاه اتومبیل) برای نشان دادن مفهوم کلاس ها. The last section of the article discusses the differences of MooTools and script.aculo.us classes. آخرین بخش از مقاله مورد بحث اختلاف MooTools و کلاس script.aculo.us.
Intermediate/Advanced Topics متوسط / پیشرفته مباحث
6. Mootools: Ajax and XHR classes 6. Mootools : آژاکس و XHR طبقات

MooTools' Ajax/XHR classes provides developers a much simpler way of working with XMLHTTPRequests by reducing the amount of code you have to write and by handling browser differences for you. MooTools 'آژاکس / کلاس XHR توسعه دهندگان فراهم می کند راه بسیار ساده تر از کار کردن با XMLHTTPRequests با کاهش مقدار کدی را که شما مجبور به نوشتن و با دست زدن به تفاوت های مرورگر را برای شما خواهد شد. This tutorial talks about the Ajax and XHR classes in brief. این آموزش گفتگو در مورد آژاکس و کلاس XHR در کوتاه.
7. Ajax Responder in MooTools 7. آژاکس پاسخگوی در MooTools

This article delves into the use, extension, and capabilities of the Ajax class in MooTools. در متن این مقاله delves به استفاده ، توسعه و قابلیت های کلاس آژاکس در MooTools. It discusses chaining Ajax requests and events, and how you can extend the Ajax class for your needs (also applicable to other MooTools classes). این بحث زنجیری شدن این درخواست از آژاکس و رویدادها ، و چگونه می توانید کلاس آژاکس برای نیاز خود (نیز قابل اجرا را به کلاس های MooTools دیگر) گسترش دهد.
8. How well do you know Mootools? 8. چقدر خوب می دانید Mootools؟

Getting started with MooTools is easy, and it won't be long until you can create wonderful effects and increase user interactivity in your web pages. شروع با MooTools آسان است ، و آن را نمی خواهد داشته باشد تا زمانی که شما می توانید اثرات خارق العاده و افزایش تعامل کاربر در صفحات وب خود را ایجاد کنید. To help you become a MooTools master, here's a checklist of common coding mistakes and its corresponding correct usage. برای کمک به شما را تبدیل به یک استاد MooTools ، در اینجا یک چک لیست مشترک از اشتباهات برنامه نویسی و متناظر با آن استفاده درست باشد.
9. Mootools Short-cuts 9. Mootools کوتاه کاهش

This is a follow-up article from the one above, focusing more on MooTools syntax usage. این مقاله پیگیری از 1 فوق ، با تمرکز بیشتر در مورد استفاده از ترکیب MooTools است. Examples involve using shorter code for selection of objects, shorthand for the Ajax class, and creating new elements. شامل نمونه با استفاده از کد کوتاه برای انتخاب اشیا ، تند نویسی برای کلاس آژاکس ، و ایجاد عناصر جدید.
10. Mootools: JSON explained 10. Mootools : JSON توضیح داد :

Mootools : JSON توضیح داد -- عکس

Here's an excellent introduction to using JSON with MooTools to provide server-side interaction to your web applications. در اینجا به معرفی بسیار عالی با استفاده از JSON با MooTools به سمت سرور را فراهم تعامل به یک برنامه وب خود. Topics covered include converting a JSON string into a JavaScript object and vice versa. مباحث مطرح شده ، شامل تبدیل رشته JSON به جسم جاوا اسکریپت و بالعکس.
11. Using MooTools' Hash.Cookie API 11. Hash.Cookie با استفاده از API 'MooTools

This article explains how to take advantage of MooTools' powerful Hash.Cookie API to make working with complex cookie utilization a cinch. در متن این مقاله توضیح می دهد که چگونه امکان استفاده از قدرتمند MooTools 'Hash.Cookie API به کار با استفاده از کوکی های پیچیده کاری که با سهولت انجام شود. The example showcases a working example of how you can store the number of times a user visits a page. به عنوان مثال ویترین به عنوان مثال کاری که چگونه می توانید تعداد دفعاتی کاربر بازدیدکننده داشته است صفحه ذخیره کنند.
12. Chaining with MooTools 1.2 12. زنجیرهای با MooTools 1.2

Chaining is beneficial for several reasons including the ability to sequentially execute events ("in a chain") as well as reduce the number of lines of code you have to write. زنجیری شدن این سودمند است به چند دلیل از جمله توانایی به صورت ترتیبی اجرا حوادث ("در زنجیره ای") و همچنین کاهش تعداد خطوط کد را شما باید بنویسید. If you're wondering about the "who, what, where" of chaining in MooTools, check out this brief but informative tutorial. اگر خوبی در مورد "چه کسی ، چه چیزی ، جایی که" از زنجیرهای در MooTools ، لطفا این آموزش کوتاه اما آموزنده است.
Practical/Working Tutorials and Examples عملی / کار آموزش و نمونه
13. AJAX mootools secure contact form 13. mootools آژاکس فرم ارتباط امن

آژاکس فرم ارتباط با ما mootools امن -- عکس

Learn how to protect your public web forms from spam and SQL injections with this tutorial on how MooTools can be used to make safer public web forms. یاد بگیرید چگونه برای محافظت از فرم های وب خود را عمومی از هرزنامه ها و تزریق SQL با این آموزش در مورد نحوه MooTools می توان برای ایمن تر کردن وب فرم های عمومی است.
14. Using CSS and Mootools to simulate Flash horizontal navigation effect 14. با استفاده از CSS و Mootools فلش برای شبیه سازی اثر ناوبری افقی

با استفاده از CSS و Mootools فلش برای شبیه سازی اثر ناوبری افقی -- عکس

Create a navigation area that smoothly scrolls left or right depending on where you hover your mouse. ایجاد منطقه ناوبری که هموار کتیبه سمت چپ یا راست بسته به جایی که شما شناور موس.
15. Facebook Sliders With Mootools and CSS 15. Sliders فیس بوک با Mootools و CSS

Sliders فیس بوک با Mootools و CSS -- عکس

Check out this nifty tutorial on how to build a Facebook-inspired set of slider controls that manipulate the opacity, width, and height of an image. را بررسی کنید این آموزش بسیار خوب در مورد چگونگی ساختن یک مجموعه عکس الهام گرفته از گروه شاهد کشویی که دستکاری کدورت ، عرض و ارتفاع تصویر.
16. MooTools Gone Wild: Element Flashing 16. MooTools وحشی رفته : عنصر فلش

MooTools وحشی رفته : عنصر چشمک می زنند -- عکس

In this tutorial, you'll learn how to make page elements flash. در این مقاله ، خواهید آموخت که چگونه عناصر صفحه فلش. It's an effective way of drawing attention to a particular section of a web page or alerting users of status changes. این یک راه موثر برای جلب توجه به یک بخش خاص از یک صفحه وب یا alerting کاربران تغییر وضعیت نیست.
17. Nice Ajax effect for message box using Mootools 17. نیس اثر آژاکس برای جعبه پیام با استفاده از Mootools

Here's a tutorial on how to display messages that fades in after the user clicks on the submit button. در اینجا آموزش در مورد چگونگی نمایش پیام های که محو در پس از کلیک کاربر بر روی دکمه ارسال. It's designed for use with web forms, but it can be modified into similar applications. آن برای استفاده با فرمهای وب طراحی شده اند ، اما می توان آن را با برنامههای مشابه تغییر یافتهاست.
18. Two CSS vertical menu with show/hide effects 18. دو CSS منوی عمودی با نشان دادن / مخفی کردن اثرات

دو CSS منوی عمودی با نشان دادن / مخفی کردن اثرات -- عکس

This tutorial shows you how to build a navigation menu that slides up and down smoothly using MooTools. این آموزش به شما نشان می دهد که چگونه برای ساخت منوی ناوبری که اسلاید بالا و پایین یکنواخت با استفاده از MooTools. The article also covers how to make a similar effect using plain JavaScript. مقاله نیز پوشش می دهد که چگونه یک اثر مشابه با استفاده از ساده جاوا اسکریپت.
19. Mootools Content Slider With Intervals 19. Mootools لغزان محتوا با فواصل

لغزان Mootools محتوا با فواصل -- عکس

Here's an excellent step-by-step tutorial on how to make a content area that slides left-to-right at set intervals – great for slideshows. در اینجا عالی گام به گام آموزش در مورد چگونگی ساختن یک منطقه محتوا اسلاید که از چپ به راست در فواصل مجموعه -- بزرگی برای نمایش اسلاید است.
20. Jazz Up Your Forms With MooTools 20. جاز تا فرم های خود را با MooTools

جاز تا فرم های خود را با MooTools -- عکس

This is a two-part series that goes over how to make your web forms fancier. این مجموعه دو قسمتی است که می رود بیش از چگونه فرم های وب خود خیال باف است. The first part shows you how to add animated field highlighting and how to display instructions to users. بخش اول به شما نشان میدهد که چگونه برای اضافه کردن انیمیشن برجسته حوزه و چگونه برای نشان دادن دستورالعمل به کاربران. In the second part , you'll step it up a notch by adding live comment previewing and auto-resizing of text areas. در بخش دوم ، شما تا مرحله آن بریدگی با اضافه کردن نظر پیش نمایش زنده و خودکار تغییر اندازه متن از مناطق.

Have you got your own personal MooTools resources to share ? دارید که مایلید تغییر دهید منابع MooTools شخصی برای به اشتراک گذاشتن؟ Got an interesting MooTools application you want to show us? کردم جالب برنامه MooTools می خواهید به ما نشان می دهد؟ Talk about it in the comments! بحث در مورد آن در نظرات!

If you found this article useful, you might also want to read : اگر شما یافت این مقاله مفید ، شما همچنین ممکن است به خواندن می خواهم به :

    * 40 Excellent Resources for JavaScript Coders 40 منابع عالی برای Coders جاوا اسکریپت
    * 16 Free JavaScript Solutions for Displaying Your Images 16 راه حل جاوا اسکریپت مجانی برای نمایش عکس شما
    * Using moo.rd to Create Image Galleries با استفاده از moo.rd برای ایجاد گالری تصویر

35 Comments 35 نظر
Peter پطرس حواری عیسی

June 20th, 2008 2008 ژوئن 20

Excellent Resources..Thank you منابع عالی.. با تشکر از شما
Pierro Pierro

June 20th, 2008 2008 ژوئن 20

Yeah, nice resources -> DIGGED آره ، خوب منابع --> DIGGED
An Jay جی

June 21st, 2008 2008 ژوئن 21

Nice list! لیست نیس! Thanks for sharing here با تشکر برای به اشتراک گذاشتن در اینجا
Farhad Dizeyi فرهاد Dizeyi

June 21st, 2008 2008 ژوئن 21

Thank you for this great tutorials and examples… It really makes it easy to understand the mootools framework. با تشکر از شما به خاطر این آموزش بزرگ و نمونه... واقعا می سازد به آسانی قابل درک چارچوب mootools. I searched the web for tutorials about mottols and found some but this one is really the best one I found. من جستجو وب برای آموزش در مورد mottols یافت و برخی از اما این یکی واقعا بهترین 1 من در بر داشت. Appreciative. سپاسگزار.

Regards با احترام
Farhad Dizeyi فرهاد Dizeyi
Rasmus راسموس

June 22nd, 2008 2008 ژوئن 22

Too bad that the material found under most of the links listed relates to mootools v1.1 and not the freshly released v1.2 :( خیلی بد است که مواد موجود در زیر بسیاری از لینکهای مربوط به mootools v1.1 و v1.2 منتشر شد تازه نیست : (

$E and $ES have been removed just as an example. $ $ الکترونیکی و بنیادی شده اند فقط به عنوان مثال حذف خواهند شد.
rborn rborn

July 2nd, 2008 2008 ژوئیه 2

here are several mootools tutorials for begginers. در اینجا آموزش mootools چند برای مبتدیان. Even somehow outdated, are very simple explained, and very easy to follow حتی به نوعی از رده خارج هستند ، بسیار ساده توضیح داده و بسیار آسان به دنبال

http://cssgallery.info/category/mootools/ http://cssgallery.info/category/mootools/
ryan رایان

July 2nd, 2008 2008 ژوئیه 2

Thanks for the MooTools tutorials .. با تشکر برای آموزشهای MooTools.. just launched our new portfolio site with some cool ajax navigation at http://www.greyemea.com , made loads of use of Mootools, but there seems to be issues with ie6. فقط راه اندازی وب سایت جدید ما نمونه کارها را با برخی ناوبری آژاکس سرد در http://www.greyemea.com ، ساخته شده بارهای استفاده از Mootools ، IE6 وجود دارد ، اما به نظر می رسد با مسائل. Has anyone else found a way to overcome the issues? است هر کس دیگری در بر داشت راه برای غلبه بر مسائل؟
Jacob Gube یعقوب Gube

July 2nd, 2008 2008 ژوئیه 2

@ryan: what are the issues exactly? @ رایان : چه مسائل دقیقا؟
PluT0 PluT0

July 24th, 2008 2008 ژوئیه 24

anybody know example or tutorial on mootool which integrated with RoR? به عنوان مثال کسی می دانیم و یا آموزش در mootool که با RoR یکپارچه؟
Posicionamiento Valencia Posicionamiento والنسیا

August 18th, 2008 2008 اوت 18

A good start to mootools. شروع خوبی برای mootools.
Boby Thomas Boby توماس

April 10th, 2009 2009 آوریل 10

excellent post. پست قوی و کاربردی. keep it up. نگه داشتن آن تا.
Abdel عبدل

May 4th, 2009 2009 مه 4

mootools never been explained any better. mootools هرگز توضیح داده شده هیچ بهتر است. heads up.Thanks a lot. سر up.Thanks زیادی.
aartiles aartiles

June 4th, 2009 2009 ژوئن 4

Nices resources, i decided to moved from Prototype to mootools, i love mootools. منابع Nices ، من تصمیم به نقل مکان از نمونه اولیه به mootools ، من تو را دوست دارم mootools.
Check my last effect plugin: http://www.flash-free.org/en/2009/05/28/e24bubblefx-photo-bubble-transition-effect/ بررسی اثر پلاگین آخرین من : http://www.flash-free.org/en/2009/05/28/e24bubblefx-photo-bubble-transition-effect/
x13 x13

June 4th, 2009 2009 ژوئن 4

About the tutorial #13 “AJAX mootools secure contact form”. درباره خودآموز # 13 "آژاکس فرم ارتباط با ما mootools امن". It is a good tutorial to learn about mootools but NOT to improve your website security. این آموزش به خوبی در مورد mootools اما نه یادگیری برای بهبود امنیت وب سایت شما. That kind of sanitization have to be done in the server side, not in the client web browser. این نوع از sanitization باید در سمت سرور انجام شود ، در مرورگر وب مشتری نیست. An attacker can use his/her own form and submit a specially crafted string without any restriction and compromise your website or your database with a XSS vulnerability or a SQL injection vulnerability. مهاجم می تواند / فرم خود را خود و استفاده از ارسال رشته خاص بدون هر گونه محدودیت و سازش و یا وب سایت شما پایگاه داده خود را با آسیب پذیری XSS و یا آسیب پذیری تزریق SQL.

Regards با احترام
Chris کریس

June 5th, 2009 2009 ژوئن 5

Thats a great list! بدین لیست بزرگ! I will refer to this from now on :> من به این بعد از این هم اشاره :>
Antony آنتونی

June 25th, 2009 2009 ژوئن 25

Tutorials here are great although i know nice mootools AJAX tutorial: آموزش در اینجا بزرگ با اینکه می دانم mootools خوب آژاکس آموزش :
http://solutoire.com/2006/11/29/mootools-the-ajax-class/ http://solutoire.com/2006/11/29/mootools-the-ajax-class/
Ryan Gliozzo رایان Gliozzo

July 16th, 2009 2009 ژوئیه 16

thanks! با تشکر! I am struggling to learn about mootools. من در مورد مبارزه mootools یاد بگیرند. I have managed to implement easyslide 1.5 on my site, and modify it. من موفق به اجرای easyslide 1.5 بر روی سایت خودم تهیه کنم و آن را تغییر دهید. This resource is helping me learn. این منبع کمک به من یاد بگیرند.
Frank رک

July 16th, 2009 2009 ژوئیه 16

Concerning the moo secure form – the checks for fraudulent input is done by a) client side and b) server side – as we are aware of client side checks are insecure :) با توجه به شکل امن صدای گاو -- چک های جعلی می باشد برای ورودی های طرف مشتری) و ب) انجام سمت سرور -- و ما آگاه هستند از چک های سمت سرویس گیرنده نا امن عبارتند از :)

The script should only show how to deal with inputs and firing events in mootools. اسکریپت تنها باید نحوه برخورد با ورودی و حوادث در شلیک mootools نشان می دهد.
Deepak دیپاک

February 13th, 2010 2010 فوریه 13

Very Useful list! لیست بسیار مفید! Thanks for sharing. با تشکر برای به اشتراک گذاری. Can you tell me a way of converting static transitions of webpages into sliding effect with the help of MooTools. آیا می توانید به من بگویید از راه انتقال ایستا تبدیل صفحات وب به اثر لغزش با کمک MooTools. I have an example of a website ( http://www.mimeartist.com/ ) which used MooTools as well but the whole code is in one file except css and js file but I want this effect on different pages linked to the navigation menu on the index page. من یک مثال از وب سایت ( http://www.mimeartist.com/ ) که با استفاده از MooTools و اما کد تمام شده است در قالب یک فایل css به جز فایل و جی اس اما من می خواهم این اثر در صفحات مختلف مرتبط به منوی ناوبری در صفحه اول. Hope you will give me some solution. امید شما برای من چند راه حل بدهد. Thanks با تشکر

.