moo ImageCrop - crop images with AJAX and PHP

mooImage crop - easy image cropping

Here it is, the worlds first easy-to-implement image cropper. This demo shows you how to use ajax and php functions to create cropped areas from images and return them directly.

This can be come in handy if you wish to let users create avatars from uploaded images with a certain with and height or any other process of cropping images.

Limitations

The demo doesn’t have things included like load image, or save image link generation. This is up to you, that demo should only show what can be archived using ajax and php.

The cropping area is actually hardcoded, but the next release will allow you to scale the box to your needs.

download

If you are interested into this script, then drop us a line!

Demo
AJAX image crop

mootools autocompleter

Yes - another autocompleter for mootools. Difference: The used search engine/code as well as that the script itself consists only of 45 lines of javascript.

Features: start checking for words after the 3rd letter input, single words only, very fast search algorithm ( the example uses a DB with 300.000 words ), cross browser compatible.

To see it in action, go here: autocompleter mootools

You will find this script in the february edition of the PHP magazine “PHP Solutions Magazine” together with some more snippets, and on the CD.

ajax newsletter dropdown mootools

Another nice snippet to have a newsletter box on your site - coded as usual with mootools and mySQL / PHP.

The box sits on the top of a page, with a handle to be clicked. The box bumps down on click, revealing the signup form for the newsletter. Combined with some mySQL and PHP code, it then adds the user to the newsletter recipients. Simple, sleak and styleable the way you want.

Of course this thing is cross-browser compliant, working in IE6 / 7, FF, Opera.

Have a look at Newsletter AJAX on top of the page you can see it live in action. Check the CSS and the source code to see how it works, or simply drop us a line, so we can send it over

Firefox 2.0.0.10 breaks reflections.js

The newly released version of Firefox, namely 2.0.0.10 breaks with the reflections.js - the canvas.drawImage() function of js won’t work here. Same goes for the beta of FF 3. The autor of the reflections.js said he can’t do anything about it, so it seems we have to wait for a new version of FF and hope that this one fixes this bug.

Update:
Download this version if you can’t wait for the full update ot 2.0.0.11:
Release Candidate Firefox

lightbox replacement - different approach

The mooSlideBox v3 is a small and slim ajax based extension or replacement of the common “lightbox” that can be found on nearly every page. This lightbox clone works in IE 6/7, Opera and Firefox.

To show the slider with an image, a heading and a sample text, you can call it this way:

Slide

To make the link a slideBox link, you need to add the tag rel=”designSlide” to it. The slide can contain a heading and some text. Define it in your title tag of the link, separate the heading from the main text with a “::”

If you wish to have more content, or html tags like links in the displayed content area, you can specify another tag in your slideBox. SlideBox uses the “rev=” tag. Give your rev tag the name of the div that contains additional content. In this sample it’s called rev=”mycontent”. This is the additional content
div:

The div containing the additional content is automatically hidden when the page is loading.

Go here for a sample and to download the script

SEO - replacing headings with images but keep the text for spiders

Maybe you sometimes wanted to replace your headlines on a site with images, but didn’t dare, as these headings are still an important part for search engine optimization.

Now, if you’re favouring using ajax, you can simply replace your headings but still show the text to the search engine bots.
With a small snippet ajax code this can be done easily. Tests with search engine like bots or our own websitecheck proves, that the search engine still recognizes the h1 and h2 tags and their contents.

Want to see it in action? Here’s our next artViper website, still under development, but with even this effect implemented. Just switch off javascript for a moment and look at the page then - or run the websitecheck test over that page. SEO meets style.

« Previous Page