A slider for mootools with support for additional html tags and images that slide from the bottom of the screen upwards.

Implementation

• HEAD:

<SCRIPT src="/mint" type=text/javascript></SCRIPT> <SCRIPT language=javascript src="/mootools.js" type=text/ecmascript></SCRIPT> 
 
<SCRIPT language=javascript src="/slimbox.js"  type=text/ecmascript></SCRIPT>

• BODY:

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

<a href="/download/mootools/mooSlide/images/0.jpg "rel="designSlide" rev="mycontent"title="Design Slide Sample:: There's some nice tool out there, and it just does what it should - 
it slides in an image with description and adds extra content 
rom a specified div">Slide</a>

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:

<div id="mycontent"><a href="http://www.hotajax.org"> visit us at www.hotajax.org</a></div>

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

works in IE 6/7, Opera and Firefox

Comments (2)

Show/Hide comments

sajjad said:

	... wow........... just perfect
	report abuse vote down vote up

August 11, 2008 | url
Votes: +0

Kyias said:

	... Perfect!
	report abuse vote down vote up

February 06, 2008
Votes: +0

Show/Hide comment form

Name

Email

Website

Comment

smaller | bigger

Subscribe via email (Registered users only)

I have read and agree to the Terms of Usage.

Write the displayed characters

Add Comment