« Thumbnailing Images in MT | Main | It's a Friday COME ON »

Javascript: A cool effect in Moveable Type

Click Here for the demo of the cool effect

The above is what I accomplished after messing around in javascript for a couple of hours. If you wanna learn how to incorporate the above effect into your Moveable Type Blog, keep reading.

1.) Create a folder named javascript on your server if you don't already have some folder you use to store javascripts on.

2.) Go to http://script.aculo.us/downloads


3.) Scroll down the screen and download scriptaculous


screenforscriptsdownload.JPG


4.) After you have downloaded scriptaculous, unzip the file.

5.) The following files you need to copy from the unzipped folder into your javascript folder(prototype.js which is in the lib folder and the effects.js which is in the src folder)


6.) Ok you have one more file to put into your javascript folder. The combo.js file you can either create yourself or download by right clicking here and selecting "Save target as". For the purposes of this tutorial, just download it, it'll be easier on you


7.) Copy the combo.js file into the javascript folder on your server where you stored the other two .js files


8.) Login to your MT Admin side. Go click on the BLOG you want to be able to utilize these files. Under Configure click on Templates


9.) Click on the Main Index under the list of templates


10.) There are three lines that need to be added in your index.html, these lines should be in the header of the code (see picture below)


headercodeforjavaeffect.JPG


The lines of code tell the html document where to look for the combo, effect, and prototype.js files.

11.) Remember after changing the template to hit the Save and Rebuild button

12.) Ok start creating a new entry and put the following code in.

13.) Save and publish your entry, an it should work.

Sites I used:
http://script.aculo.us/
http://24ways.org/advent/introduction-to-scriptaculous-effects

Note: If you want these effects to work in BLOG entries after they're archived, remember to go into Templates and add the code in the templates under Archives where appropriate. Rebuild the site after you make these code changes, otherwise the effect won't work.

TrackBack

TrackBack URL for this entry:
http://www.normalamerica.com/cgi-bin/mt/mt-tb.cgi/18

Post a comment

About

This page contains a single entry from the blog posted on March 30, 2006 3:20 PM.

The previous post in this blog was Thumbnailing Images in MT.

The next post in this blog is It's a Friday COME ON.

Many more can be found on the main index page or by looking through the archives.

Powered by
Movable Type 3.31