tinyMCE - submit via AJAX problem

TinyMCE is a great editor, but if you try to use mootools or any other javascript framework to submit your post, the post variables of the ( former ) textarea will stay blank.

A simple addition to the submit button resolves this issue:

onclick="tinyMCE.triggerSave(true,true);"


After that, your post variables are all submitted as usual.

mooImageInfoSlider - slide information about the image as bottom-up slider in the image itself

Want to show additional information about an image but you’re no fan of flash to have some nice bottom-up slide implemented? Here you go, a small and easy to use script to show the < > tag of each image in a slider that covers parts of the image.

Adjustable

You can influence the whole thing by defining:

* font-size
* background-color
* slide speed
* slide effect ( Bounce, linear etc )
* background-image

Demo

You can see a live demo here: mooImageInfoSlider

How-To

Simply wrap each image into a DIV with the className .myImages. So this would yield that (X)HTML code for example:
HTML Code

CSS Styles

Here are some styles that are used in the demo:

.myImages{
position:relative;
display:block;
float:left;
margin:0 10px 0 0 ;
}

Script Effects

After that, adjust the settings in the script to match your needs. Find that part, which includes the look and feel of the sliders:

var container = new Element('div', {

In there are all styles like background-image, background color etc.

The effects are done in these parts:

e.addEvent('mouseenter',function(){
and
e.addEvent('mouseleave',function(){


from there you can influence the effects, duration etc. For possible effects please refer to the mootools documentation.

Compatibility

This script has been tested in following browsers

* Firefox 2 / 3
* Internet Explorer 6 / 7
* Opera
* Chrome

Download

Grab your copy here mooImageInfoSlider ( including mootools 1.2 framework and demo page )

mooSlide for mootools 1.2

Due to many requests to rewrite the mooSlide snippet for the mootools 1.2 framework we’ve done it, and you can download it right away here:

mooSlide for mootools 1.2

In addition we have added the functionality to load external content instead of having the content div on the page and make it hidden via CSS.

mooSocialize update

The mooSocialize script has been updated. It now takes the url correctly, as there have been an issue when more than one “&” has been in the query string. This bug has been fixed now and the mooSocialize works as expected.

Please re-download your copy here: mooSocialize or get your wordpress plugin here mooSocialize wordpress plugin

mooSlide - revamp!

Done - the new mooSlide is easier to use than ever as it has become a mootools class, with a lot of options that you can influence. The best of it: The slider can contain ANY content, so put videos, flash, images, text or html stuff in it.

The options:

* The slider DIV
* The slide in speed
* The fade out speed
* Remove on click yes / no
* The final opacity
* The height of the slider container
* The type of effect used ( see the mootools transitions effects )
* The toggler element ( i.e. a link )

Calling the box:

var px = new mooSlide2({ slideSpeed: 1700, fadeSpeed: 500, toggler:’toggle’, content:’test’, height:250, removeOnClick: true, opacity:’1′, effects:Fx.Transitions.Bounce.easeOut });

whereas the toggler is the element that will show / hide the box, content defines the div’s ID with your slide contents, the rest of the options should be self-explanatory.

Demo:
mooSlide 3.2

mooHorizonSlider

this little slider class is build with the mootools framework 1.11. You can define various things:

* single image movement left / right
* multiple movement left / right
* scroll speed
* image container
* image size

In conjunction with the needed CSS style for the scroller, it creates an easy to use image slider. The slider class can be adjusted to fit your needs perfectly - imageWidth, imageCount, scrollRanges etc.

Check out the source of this page to see how it is implemented. You can also use this line of code, adjust it to your needs, copy the CSS to your file and get it going:

var p = new avScroll({container:’innerScroller’, imgWidth:233, scrollRange:24, leftHandle:’leftClicker’,rightHandle:’rightScroller’, rw:’leftFF’, ff:’rightFF’, speed:700});

Check it out here: moo horizontal slider