[jQuery] news scroller example with innerfade and easing plugin

[joomlafreak]

I thought I would share a news scroller like module I developed using
innerfade and easing plugins here.

this is how made some changes in innerfade plugin

$.innerfade.next = function (elements, settings, current, last) {

        if ( settings.animationtype == 'slide' ) {
                $(elements[last]).slideUp(settings.speed, $
(elements[current]).slideDown(settings.speed));
        } else if ( settings.animationtype == 'fade' ) {
                $(elements[last]).css("z-index","-2").fadeOut(settings.speed/3);
                $(elements[current]).css({top: 
94}).css("z-index","-1").animate({top:
0},{duration:settings.speed,easing: 'expoout'});
        } else {
                alert('animationtype must either be \'slide\' or \'fade\'');
        };
......
rest of the plugin is same.

this is the html

<div id="newsscrollerjp">
<div class="newsitemjp_outer">

                        <div class="newsitemjp">
                        <div class="insidejp">
                                <img 
src="http://www.joomlaprodigy.com/images/stories/
prettypicturejp_logo.png" class="img" alt="" alt="" width="200"
height="180" align="left"/>

                                <a class="newsitemjp_heading" 
href="http://www.joomlaprodigy.com/
content/view/207/46/">PrettyPictureJP Module Released</a><br/>
                                <span class="small">Sat, 05 May 2007</span><br/>

 PrettyPictureJP module is released today. Please read the module
s...<br/><br/>

                                <a class="readon" 
href="http://www.joomlaprodigy.com/content/view/
207/46/">Read More...</a><a href="http://www.joomlaprodigy.com/content/
blogsection/1/46/">Read All...</a>
                        </div>
                        </div>




                        <div class="newsitemjp">
                        <div class="insidejp">


                                <a class="newsitemjp_heading" 
href="http://www.joomlaprodigy.com/
content/view/206/46/">New Ajax rating system on JP</a><br/>
                                <span class="small">Fri, 04 May 2007</span><br/>


I am using a new mambot AjratingJP on JoomlaProdigy.com (which
stan...<br/><br/>
                                <a class="readon" 
href="http://www.joomlaprodigy.com/content/view/
206/46/">Read More...</a><a href="http://www.joomlaprodigy.com/content/
blogsection/1/46/">Read All...</a>
                        </div>
                        </div>


        </div><div class="newsitemjp_outer">

                        <div class="newsitemjp">
                        <div class="insidejp">


                                <a class="newsitemjp_heading" 
href="http://www.joomlaprodigy.com/
content/view/205/46/">New Ajax rating system on JP</a><br/>

                                <span class="small">Fri, 04 May 2007</span><br/>

I am using a new mambot AjratingJP on JoomlaProdigy.com. This
mambo...<br/><br/>
                                <a class="readon" 
href="http://www.joomlaprodigy.com/content/view/
205/46/">Read More...</a><a href="http://www.joomlaprodigy.com/content/
blogsection/1/46/">Read All...</a>
                        </div>
                        </div>




                        <div class="newsitemjp">
                        <div class="insidejp">

                                <img 
src="http://www.joomlaprodigy.com/images/stories/large_icons/
alert.png" class="img" alt="" alt="" width="200" height="180"
align="left"/>

                                <a class="newsitemjp_heading" 
href="http://www.joomlaprodigy.com/
content/view/200/46/">New Version of Feedgator 0.7C42</a><br/>
                                <span class="small">Tue, 24 Apr 2007</span><br/>


For those of you who are disappointed with the feedgator earlier...<br/
><br/>
                                <a class="readon" 
href="http://www.joomlaprodigy.com/content/view/
200/46/">Read More...</a><a href="http://www.joomlaprodigy.com/content/
blogsection/1/46/">Read All...</a>
                        </div>

                        </div>

        </div>
</div>


You can see an example running in header of my website www.joomlaprodigy.com.