MooTools教程 MooTools这个JavaScript框架越来越流行了介绍几个MooTools的入门教程。 MooTools入门教程 mootootls元素属性 MooTools类介绍使用 MooTools 入门教程:选择和创建元素 这是一篇面向初学者的MooTools 入门教程,他介绍了选择和创建元素的方法。
浏览教程: A beginner’s MooTools – select and create elements MooTools 官方的文档与演示 MooTools Docs(最新英文版) MooTools文档中文版V1.2 MooTools Demos 30天学会MooTools系列教程 这个30天学会MooTools系列教程,列出了各个方面的MooTools学习内容还差几个构成30个教程。
- 框架简介
- 选择器
- 使用数组介绍
- Functions 函数
- 事件处理
- 操作的HTML
- 设置和获取样式属性
- 输入过滤第一部分-数字
- 输入过滤第二部分-字符
- 使用FX.Tween
- 介绍 Fx.Morph, Fx Options 和Fx Events
- 使用Drag.Move拖放
- 正则表达式
- 周期和介绍哈希值
- 幻灯效果
- 介绍排序方法
- 手风琴效果
- 类第I部分
- 工具提示
- 几个MooTools标签
- 类 II部分
- Fx.Elements
- Fx.Slide
中文译本网址:MooTools 1.2系列教程目录。 MooTools模仿Facebook对话框 这篇教程使用MooTools在Facebook常见的一个对话框效果,在开心网也有这个对话框效果。
浏览教程:Facebook modal box 使用MooTools自定义缺失图片 这篇教程是关于使用MooTools创建一个效果:当图片不显示的时候使用自定义图片替换。 浏览教程: Using custom missing image graphics MooTools 发送电子邮件通知 这是一篇关于如何在显示图像的时候出现中断之后,使用Ajax和PHP来发送的电子邮件通知,使用了MooTools框架创建这个效果。
浏览教程: Sending Email notifications for broken images Skype样式安钮 这篇教程使用了MooTools创建一个Skype样式安钮效果。
浏览教程: Skype-style buttons MooTools 创建手电筒效果 这篇教程使用了MooTools框架来模拟一个手电筒效果,背景使用的暗淡的场景,鼠标是手电筒光源。 浏览教程: MooTools Flashlight effect 使用MooTools创建Snook样式动画导航 这个教程讲述了一个使用MooTools创建动画导航导航效果,这个效果 使鼠标在导航上的时候背景图片出现波浪等动画效果,他是Using jQuery for Background Image Animations的MooTools版本。
浏览教程: Create Snook-Style Navigation Using MooTools MooTools分解载入Ajax页面效果 这个教程介绍一个有趣的效果,它是由MooTools创建的,显示了一个原有页面文字分解,然后载入新的Ajax页面的动画效果。
浏览教程: Explode effect on Ajax page loads cookie保存字体大小滑块 文章介绍了使用MooTools框架创建的JavaScript一个使用cookie来保存滑块设置的字体大小的教程。这个效果使用了滑块动画来设置字体大小,并且在设置好后自动保存信息到cookie中去。
浏览教程: Font-Size scroller with Cookie save 使用谷歌分析跟踪Ajax链接点击 这篇教程使用MooTools和谷歌分析就是统计工具来创建了一个跟踪Ajax链接点击的方法。
浏览教程: Track Ajax link clicks using Google Analytics 使用MooTools设置Ajax更新周期 这篇教程介绍一个使用MooTools框架进行ajax通信的时候使用periodical函数设置Ajax的更新周期,教程中设置的周期是5秒。
浏览教程: Periodicar Ajax updates using MooTools MooTools 模拟flash水平导航 这篇教程介绍使用MooTools 创建一个网页中常用到的模拟flash水平导航效果。
浏览教程: Simulate Flash horizontal navigation MooTools产品高亮效果 文章介绍了一个详细的教程使用MooTools创建的鼠标移动到对应项目是显示提示相关信息的产品高亮效果教程。 浏览教程:Product Highlighter MooTools 自动提取图片标题 这篇文章介绍了使用MooTools自动提取图片的title属性作为该图片的标题。
浏览教程:Auto caption images MooTools toElement 方法 toElement 方法是MooTools常用的一个方法,这篇文章介绍了toElement 方法的用法,它可以添加类或对象。
浏览教程:toElement method MooTools outerClick事件 这篇教程介绍了一个使用MooTools创建的新事件类型,outerClick事件鼠标点击事件。浏览教程: outerClick event MooTools 文件保存列表 这篇文章介绍了个使用MooTools和php创建的文件保存列表,可以自定义添加文章的目录,使用Ajax实现的这个功能的教程。浏览教程: Saving a sortalbe nested list MooTools CSS sprites(css精灵)实现 CSS sprites(css精灵)是在网页制作中将图片合并并使用css设置背景图,这篇文章介绍了使用MooTools实现CSS sprites(css精灵)动画效果的教程。
浏览教程: CSS sprites with MooTools MooTools Swiff 类 Swiff是MooTools的一个工具类,它能够使用JavaScript创建flash在网页中,并且能够使JavaScript和flash进行变量通信。 官方网址:Swiff 使用CSS和MooTools 使sIFR应用于打印效果 sIFR是一种姿态替换的方法,可以使浏览器没有的字体替换,一般是在屏幕显示的,这篇文章介绍了使用CSS和MooTools代码将sIFR字体替换效果应用于打印预览时的字体。
浏览教程: Fixing sIFR printing with CSS and MooTools MooTools自定义事件 这篇文章介绍了使用MooTools实现自定义事件的方法,实现了一个alt+鼠标点击的事件。
浏览教程: Custom Events MooTools元素存储 教程讲述了MooTools开发中关于元素存储的方法,使用了一个覆盖方法,更改属性。
浏览文章: Element Storage MooTools链Chain教程 文章介绍了使用MooTools实现链Chain的教程。
浏览教程: Chaining with MooTools MooTools为媒介设置css样式 教程提供了一个方法为不同的媒体设置不同的css样式,使用MooTools构建的。
浏览文章: Set style per media MooTools自定义选中类 这篇文章是一个使用MooTools创建的自定义选中类,自定义了一个选中类的效果
演示例子: demo
浏览教程: Creating a custom “:selected” pseudo-class in MooTools MooTools鼠标教程 这篇教程使用MooTools开发了一个使用JavaScript控制记录鼠标刚才的动作的代码。
浏览教程:The Mouse Ghost 5个 MooTools 开发高级技术 文章介绍了5个在使用MooTools框架开发程序的高级技术。包括有:使用Class.toElement 和 $、使用元素存储地址、闭包方法使用等开发时比高级的技术。
浏览教程: 5 Advanced techniques for MooTools development MooTools代码重用性 这篇教程介绍了在使用MooTools开发程序的时候代码重用性问题,自调用函数、使用扩展的方法实现代码重用性。
浏览教程:Don’t repeat your Moo MooTools单态类教程 这篇文章介绍了实现在MooTools中的单态类(Singleton Class)的方法,是oop面向对象编程的常见问题。
浏览教程: MooTools Singleton Class Mutator MooTools定义私有方法 这是关于在MooTools框架中定义私有方法的教程,这也是oop面向对象编程常见的问题。 浏览教程: Private methods in MooTools MooTools绑定类 这篇文章介绍了在MooTools中实现绑定类的方法,这个是oop常见的问题。 浏览教程:Class.Binds for MooTools is Back SmoothScroll:MooTools窗口页面滚动插件 SmoothScroll是一个基于MooTools的窗口页面滚动插件可以点击链接实现页面滚动效果。 演示地址:View Dem 代码地址:SmoothScroll Kroppr:MooTools图片切割效果 Kroppr是一个基于MooTools的图片切割效果的插件。 官方网址:Kroppr mooSocialize:MooTools社会化按钮 mooSocialize是基于MooTools创建的一个社会化按钮小工具,效果非常漂亮。 官方地址:mooSocialize MooTools事件日历插件 这个是用MooTools创建的显示事件信息的日历插件。 插件地址:MooTools Event Calendar 。 Pamoorama Pamoorama是一个MooTools插件,他创建一个容器div,使用户能够通过滚动包含图片 以横向滚动显示一个全景图像。
官方网址:Pamoorama 演示例子: Sample 1 Sample 2 Sample 3 Slider:MooTools滑动块插件 Slider是一个MooTools滑动块插件,实现常见的类似横向滑动条效果。
官方网址:Slider SortableTable :MooTools表单插件 SortableTable可以实现表单排序、按条件过滤表单数据的效果,他是基于MooTools的表单插件。
官方地址: SortableTable MooWheel:MooTools可视元素关系插件 MooWheel是一个用MooTools创建的可视元素关系插件。 官方网址: MooWheel 演示地址: larger, AJAX-powered demo Moosture :MooTools鼠标手势插件 Moosture 实现了模拟鼠标手势的效果,很有趣,是由MooTools框架开发的插件. 官方网址: Moosture . inlineEdit:MooTools 行编辑插件 inlineEdit 实现了一个编辑行代码的效果,在点击行文字的时候变成编辑框的MooTools工具。MooTools 行编辑插件。 官方网站: inlineEdit MooTools导航菜单插件 介绍几个基于MooTools的导航菜单插件 Image Menu 是一个图片切换导航MooTools菜单。 Sexy sliding JavaScript side bar menu 是边栏导航条MooTools菜单。 MooFlow 是图片幻灯导航MooTools插件。 Simple 3D Carousel 3d导航效果MooTools插件。 MooHover 是鼠标选定菜单MooTools插件。 mooRainbow:MooTools调色板工具 mooRainbow使用MooTools实现了实用的调色板效果工具。 官方网址: mooRainbow Rounded Corners:MooTools圆角工具 Rounded Corners 是一个MooTools框架实现的圆角生成工具.能够在div上创建圆角效果,可以实现css3的圆角矩形效果。 官方网址:Rounded Corners Reflection:MooTools图片倒影插件 Reflection图片倒影效果工具,它是基于MooTools的实现了一个,使用代码生成图片倒影的效果。 官方网址:Reflection MooColumns:MooTools多列工具 MooColumns是一个MooTools的动态多列工具类。 官方网站: MooColumns MooScroll:mootool滚动条插件 MooScroll是一个基于mootool框架创建的滚动条插件,实现了一个自定义滚动条效果. 官方网站:MooScroll RabidRatings 基于MooTools,PHP的星级评比插件 使用MooTools与PHP开发的一个简单,易用的评价控件,最新版为RabidRatings v1.4.2。 官方网站:RabidRatings v1.4.2 Window.Growl 2.0 淡入淡出的信息提示效果 Growl基于MooTools开发,它可以让你创建淡入淡出的提示信息效果。 官方网站:Window.Growl 2.0 MooTools工具提示插件 介绍三个基于MooTools工具提示插件:
Window Growl 是模拟Mac OS系统的提示效果的MooTools工具提示插件。 Tips 是又MooTools工具提示插件,演示地址:DEMO 。 MooTooltips 可以加载Ajax提示效果工具提示。 FormCheck:MooTools表单检测插件 FormCheck:是一个MooTools框架开发的表单检测插件,可以实现定义表单验证规则 。 官方网址:FormCheck Calendar:MooTools日历插件 Calendar是一个基于MooTools的日历插件,功能简单,用于创建日期选择器。 官方网址:Calendar vlaCalendar 日历插件 Vista-like Ajax Calendar (vlaCalendar) 是Windows Vista任务栏日历的一个Web实现.采用MooTools Javascript框架开发。 官方网址:vlaCalendar Fancy MooTools Date Picker简单实用的日历插件 Fancy MooTools Date Picker 简单实用的日历插件,基于MooTools开发的,参数设置非常明了。 官方网址:Fancy MooTools Date Picker Validate:MooTools验证插件 Validate:是一个简单的表单验证插件。它是基于MooTools框架的。 官方地址:Validate JavaScript时间选择器 是一个基于MooTools的时间选择器使用图片选择当前时间,方便可视选择时间。 官方地址: JavaScript Time Picker MultipleSelect:MooTools多选择界面 MultipleSelect是一个MooTools框架下的完全自由定制的多选择元素界面。自定义了一个多选对号图标。 官方地址: MultipleSelect HTML 表单提示 HTML 表单提示实现了效果在表单填写时帮助文字数显示,使用MooTools实现这个效果。
官方网址:HTML Form Tips
演示地址:DEMO
elSelect 自定义的SELECT元素 elSelect是一个基于MooTools框架开发的自定义SELECT元素,elSelect is a great tool that allows you to visually change look and feel of usual select, keeping its functionality. 官方网址:elSelect Select Box Factory:MooTools选择框 Select Box Factory 是一个使用了MooTools选择框效果的插件,可以实现元素选择移除的效果。
代码网址:Select Box Factory v1.0 Lightbox Lightbox是一个MooTools的覆盖弹出框插件,支持图片弹出大图等效果。 官方地址:Lightbox QuickBox Lightbox QuickBox是一个基于MooTools1.2版本开发的Lightbox控件。与其它Lightbox控件相比,它最大不同之处在于可以利用鼠标滚轮控制图片切换。 官方网址:QuickBox Lightbox Milkbox Lightbox Milkbox基于MooTools1.2框架开发的Lightbox插件。 官方网址 :Milkbox Lightbox Videobox: Lightbox for videos Videobox是一个只有6k大小的脚本,用于在页面中显示视频。Videobox使用swfobject来嵌入Flash。视频可以来自Youtube、Metacafe、Google Video、iFilm和自己设置的Flash。 官方网址:Videobox。 Slideshow 2 :MooTools图片幻灯 Slideshow 2是一个MooTools图片幻灯插件,实现了漂亮的相框和图片切换动画效果。 官方网址:Slideshow 2 SmoothGallery:MooTools幻灯效果 SmoothGallery 2.0是MooTools幻灯效果插件可以实现各种图片切换效果。
官方网址:SmoothGallery 2.0
演示地址:demo Imago 支持Ajax的图片画廊 一个基于MooTools框架开发的Ajax Image Gallery 。 官方网址:Imago Fancy upload 是一个MooTools插件实现上传功能效果。并且显示进度条效果。官方网址:Fancy upload
演示地址:
Attach a File A reduced and snappier interface (preview).
Queued Photo Uploader Showcase with converted FancyUpload.
Single File Button A si .
MooTabs – MooTools选项卡效果 MooTabs是MooTools的一个实现选项卡效果的小插件。官方地址:MooTabs – Tiny tab class for MooTools
显示例子:
-MooTabs using default CSS File and AJAX to get the panel’s content: Watch
-MooTabs using default CSS File and Default Options: Watch
-MooTabs using a modified CSS File and custom Options: Watch
-MooTabs using another modified CSS File and custom Options: Watch
Ajax登陆框 使用MooTools实现的Ajax登陆框效果,并且提供了下载代码。 显示效果:demo 官方网址:Ajax login form Page Loader Ajax页面载入类 Page Loader 提供了一个MooTools的Ajax页面载入类,可以通过Ajax载入一个页面内容。 官方网站: Page Loader MooTools Dotter MooTools Dotter 是一个使用MooTools实现Ajax载入图片等文件显示等待效果的插件。 官方网址:MooTools Dotter MediaBoxAdvanced MediaBoxAdvanced 是一个MooTools 图片覆盖效果插件支持多种媒体格式。 官方网站:MediaBoxAdvanced 演示地址:demo Multibox Multibox是MooTools的一个弹出效果框插件,支持多种媒体:图片、flv等。 官方网站:Multibox SlideItMoo – 图片幻灯效果 SlideItMoo 是MooTools的一个图片幻灯效果插件。 代码网址:SlideItMoo 演示地址:demo ReMooz ReMooz是MooTools的一个图片放大插件,效果是点击小图片,出现大的图片效果。
官方网站:ReMooz mooSlide 3.2 mooSlide 3.2是MooTools实现的一个显示在窗口底部或在页面的顶部重叠层效果。 官方网站:mooSlide 3.2 演示地址: Demo moo.rd moo.rd是MooTools的一个插件集提供了表格管理等插件效果。 官方网站:moo.rd 演示例子: examples Clientcide Plugins Clientcide Plugins 是一个大的MooTools插件集,集成了许多常用的MooTools功能 官方网站 : Clientcide Plugins Meteora Meteora 是一个 MooTools的插件集合包括许多小工具,有日历、数据表、文本输入、对话框等控件。 官方网站: Meteora 演示地址: demo Mocha UI Mocha UI 是一个使用mootool框架开发的富用户界面,有滑块 ,菜单,树形目录,小窗口等界面效果。Mocha UI JxLib JxLib 是MooTools一个富客户端用户界面代码库,rich client ui library。有常见的树形目录,选项卡等界面。JxLib