MooBox dialog box plug-in based on Mootools _ Mootools

In the past few days, a mootools component was written in the spare time of the evening. The prototype is jQueryUIDialog. To prevent duplication, it is called mooBox. on the one hand, out of interest in mootools (although not as hot as jQuery), on the other hand, it also wants to add a little power to the promotion of mootools, although this is insignificant.

With the two previously released mootools components, the general feeling is:

In terms of effect implementation, it is indeed easier and faster to write with jQuery than to use mootools, because jQuery has already taken into consideration many details. for example, mootools-core does not have a method similar to slideUp/Down. If you do not introduce an extension library, you must use the Fx class to implement it yourself. In jQuery, slideUp is called easily, slideDown or slideToggle. For example, in mootools, you need to write several codes to obtain the size information of a hidden (display: none) element, in jQuery, you can ignore whether the element is hidden or not. It has already been done for you. for example, jQuery already provides users with a variety of selectors, which is especially convenient. mootools is a little lacking.

I am not saying how mootools works, because the original design of mootools and jquery is different. If you want to learn more about the details, it is good to use mootools as the base library.

Next I will return to the topic of the article. I will release two demos first.

Full display:

Shrinking status

If you are interested in this component, you can click to download it. The source code of the MooBox is not compressed, doc.html is the component description file, and demo.html is a complete example.

Let's look at a sample question. We hope that you will first introduce reset.css and css (such as font, color, and line style) that define the basic style ).

Finally, I hope it will help you:) If you have any questions, leave a message to discuss them.