Mootools

Mootools1.2教程定时器和哈希简介 2016-06-12

在今天的教程中,我们将关注两块内容:第一个就是.periodical;方法,然后我们再对hash做一个简介.定时器能比它表面看起来做更多的事情--定时能定期地触发一个函数.另一方面,hash则是键值对(key/value)的集合.如果你对hash还不熟悉现在也不要着急--我们今天就会做一个快速简要的介绍,并且会提供一些延伸阅读的相关链接.就像MooTools中的所有东西一样 ...

MooTools页面滚动浮动层智能定位实现代码 2016-05-11

MooTools 页面滚动浮动层智能定位实现代码,需要的朋友可以参考下.HTML代码: 代码如下: <div class="float" > 我是个腼腆羞涩的浮动层... </div> JS代码: 代码如下: var $smartFloat = function(elements) { var position = functio ...

MooTools1.2中的Drag.Move来实现拖放 2016-04-15

今天我们开始第十二讲,今天我们将仔细看一下Drag.Move--一个很强大的MooTools类,它可以让你给你的web应用添加拖放功能.它的使用和我们见过的其他的插件类似:首先你使用"new"关键字来创建一个Drag.Move对象并赋值给一个变量,然后你再定义你的选项和事件.这就是全部要做的事情,不过你一定要注意一下下面的例子中描述的IE的CSS怪异现象 ...

Mootools1.2教程输入过滤第二部分字符串 2016-02-28

今天我们来看一看MooTools给我们提供的额外的一些处理字符函数.这只是MooTools字符串处理中的一部分,并不包含一些神秘的函数比如toCamelCase和使用正则表达式处理字符串的函数.我们会在以后另外用一讲来将一下正则表达式的基本知识和在MooTools下的使用. 在开始之前,我想先花一点时间来看一下字符串函数是怎么调用的.在我的例子中,我是在字符串变量上面直接调 ...

用Mootools获得操作索引的两种方法分享 2016-01-28

用Mootools获得操作索引的两种方法分享,需要的朋友可以参考下.我们先说一下第一种方法,(此方法为一位QQ好友提供,感谢此人,此人昵称是:exf) 代码如下: <body> <ul>Title1 <li>11111</li> </ul> <ul>Title2 <li>22222</ ...

Mootools1.2教程函数 2015-12-15

讲一讲JavaScript中的函数function的基本知识.今天开始MooTools系列教程的第4讲.如果你还没有看过上一讲,请先查看上一篇教程<Mootools 1.2教程(3)--数组使用简介>.今天我们先不讲MooTools,而是讲一讲JavaScript中的函数(function)的基本知识. 但是,为了符合MooTools这个主题,你需要知道在哪里该 ...

Mootools1.2教程选项卡效果Tabs 2015-11-22

今天将不只是受限于这个库和一些基本的编程知识,我们来做一个简单的小项目.通过使用我们目前为止已经学过的一些知识,有几种方式来创建当鼠标移上去或者点击时显示相应内容的tab.简单的"额外信息"标签(TAB) 鼠标移上去显示内容的TAB 在这第一个项目中,我们要创建一个简单的菜单,当鼠标移动到这些菜单上时显示相应的内容.首先,我们来完成HTML代码--我们就 ...

Mootools1.2教程(3)数组使用简介 2015-11-22

在上一篇教程--Mootools 1.2教程2--DOM选择器中,我们介绍了一下选择器,其中有很多方法就会返回数组一个你可以对其中内容进行多种操作的特殊列表.今天,我们在来看看如何使用数组来管理DOM元素.基本方法 .each(); 在处理数组时,.each();方法是你最好的朋友.它提供了一种很容易的方法来遍历数组的每个元素,如果有需要还可以对其中的元素进行任何逻辑处理. ...

MooBox基于Mootools的对话框插件 2015-11-16

MooBox基于Mootools的对话框插件
这几天, 利用晚上的闲暇时间, 写了个mootools组件,原型来自于jQuery UI Dialog, 为防止重复,就起了名字叫mooBox.一方面出于对mootools的兴趣(虽然没有jQuery那么hot), 另一方面,也是想为mootools的推广添一点小小的力量,虽然这微不足道. 加上前面发布过的2个mootools组件, 写下来总的感觉是: 在效果实现方面, 确 ...

基于mootools1.3框架下的图片滑动效果代码 2015-11-08

基于mootools1.3框架下的图片滑动效果代码
容器采用相对定位,图片采用绝对定位,当鼠标移动到相应的图片上,改变去left属性,用tween实现动画效果.效果预览如下: 实现原理: 容器采用相对定位,图片采用绝对定位,当鼠标移动到相应的图片上,改变去left属性,用tween实现动画效果. 代码分析:写一个picSlider类实现代码封装 代码如下: <div > <img src="htt ...

Mootools1.2教程设置和获取样式表属性 2015-10-16

今天,我们来看一下如何通过MooTools 1.2和我们以前几讲中的内容来操作样式,这将给你在UI上带来很大的控制权.欢迎开始这一系列的教程的第七讲.今天,我们来看一下如何通过MooTools 1.2和我们以前几讲中的内容来操作样式,这将给你在UI上带来很大的控制权.处理样式非常简单,不过今天我们要做一些调整.例如,我们要介绍键值对(key-value pair)对象.我们 ...

Mootools1.2手风琴Accordion教程 2015-09-21

继续我们的"更多"More库里面的插件教程,今天我们来学习一下可能是最流行最受欢迎的插件--手风琴.创建和配置一个基本的手风琴很简单,但是你一定要认真看完全文,因为更多的高级选项可能有一些复杂. 基础知识 创建一个新的手风琴 要创建一个新的手风琴,你需要选择一些成对的元素--包含标题和内容.因此,首先,需要给每一个标题和每一个内容块分别指定一个css类名 ...

一些mootools的学习资源 2015-08-23

一些mootools的学习资源,学习mootools的朋友可以参考下.http://www.clientcide.com/ 一个mootools plugins的网站,有自己的库提供下载http://cssrainbow.cn/index.php/mootools/665.html mootools完美解析 http://www.consideropen.com/blog/ ...

Mootools1.2教程(2)DOM选择器 2015-08-18

今天开始本系列教程的第2讲.在这一讲中,我们会学习几种选择HTML元素的方法.在许多方面,这是MooTools用得最多最基本的.毕竟,要创建一个基于HTML元素的交互性用户体验,你必须首先把它们掌握在手中.如果你还没有准备好,请先阅读上一篇<Mootools 1.2教程(1)--MooTools介绍>.我们讲了怎么引用MooTools 1.2以及怎么在domre ...