Steve, I am sorry its working now.
I will try it with feeds. Thanks a lot. Deepali. On Aug 14, 3:58 pm, deep <[email protected]> wrote: > It showing me, only first image. no effect . no error. > what to do? > > On Aug 14, 3:52 pm, "Steve Onnis" <[email protected]> wrote: > > > It all works form me > > > Are you getting an error? If so what is it? > > > -----Original Message----- > > From: deep [mailto:[email protected]] > > Sent: Friday, 14 August 2009 8:25 PM > > To: MooTools Users > > Subject: [Moo] Re: Auto Fade in Fade out > > > Hey steve, > > > Thnaks for your immidiate response. i have tried your code but it > > seems its not working for me. :( > > bellow is the code. > > [code] > > <html> > > <head> > > <script type="text/javascript" > > > > <script type="text/javascript" src="mootools-1.2.3-core-yc.js"></ > > script> > > <script type="text/javascript" src="mootools-1.2.3.1-more.js"></ > > script> > > <script type="text/javascript" src="layout.js"></script> > > <script type="text/javascript" src="Actions.js"></script> > > <script type="text/javascript" src="Editor.js"></script> > > > <script type="text/javascript"> > > var SlideShow = new Class({ > > Implements : [Events, Options], > > Extends: Fx, > > options : { > > delay : 1000, > > duration : 2000, > > onInitialize : $empty, > > onChange : $empty, > > onMouseOver : $empty, > > onMouseOut : $empty, > > onPress : $empty, > > onStart : $empty, > > onComplete : $empty > > }, > > initialize : function(element, options) { > > this.setOptions(options); > > this.container = element, > > this.children = > > this.container.getElements(this.container.getFirst > > ().tagName); > > > this.options.init = !options.onInitialize ? $empty : > > options.onInitialize.bind(this); > > this.options.start = !options.onStart ? $empty : > > options.onStart.bind > > (this); > > this.options.mouseover = !options.onMouseOver ? $empty : > > options.onMouseOver.bind(this); > > this.options.mouseout = !options.onMouseOut ? $empty : > > options.onMouseOut.bind(this); > > this.options.click = !options.onPress ? $empty : > > options.onPress.bind > > (this) > > > this.children.addEvent("mouseover", function() > > {this.options.mouseover.run();}.bindWithEvent(this)); > > this.children.addEvent("mouseout", function() > > {this.options.mouseout.run();}.bindWithEvent(this)); > > this.children.addEvent("click", function() > > {this.options.click.run > > ();}.bindWithEvent(this)); > > > this.intervalID = null; > > this.currentIndex = 0; > > this.children.setStyle("opacity", 0); > > this.children[0].setStyle("opacity", 1); > > > this.count = this.children.length; > > this.position = this.currentIndex+1; > > > this.init(); > > > }, > > > init : function () { > > this.options.init.run() > > }, > > start : function () { > > this.fireEvent("start"); > > }, > > mouseover : function () { > > this.options.mouseover.run() > > }, > > > click : function () { > > this.options.click.run() > > }, > > complete : function () { > > this.fireEvent("complete"); > > }, > > play : function () { > > this.intervalID = this.next.periodical(this.options.delay, > > this) > > }, > > > stop : function () { > > $clear(this.intervalID); > > }, > > > next : function () { > > this.fadeOut(); > > this.fadeIn(); > > this.fireEvent("change"); > > }, > > > fadeIn : function () { > > this.currentIndex = this.currentIndex+1 == > > this.children.length ? > > 0 : ++this.currentIndex; > > this.position = this.currentIndex + 1; > > new Fx.Morph(this.children[this.currentIndex], { > > duration : this.options.duration, > > wait : false, > > onStart : function () > > {this.fireEvent("start")}.bind(this), > > onComplete : function () > > {this.fireEvent("complete")}.bind(this) > > }).start({"opacity": 1}); > > }, > > > fadeOut : function () { > > new Fx.Morph(this.children[this.currentIndex], {duration : > > this.options.duration, wait : false }).start({"opacity": 0}); > > }, > > > getCount : function () { > > return this.count; > > }, > > getPosition : function () { > > return this.position; > > }, > > getItem : function () { > > return this.children[this.currentIndex]; > > } > > }); > > > /// JS for html page > > > window.addEvent("domready", function () { > > slideShow = new SlideShow ($("slide"), { > > delay : 2000, > > duration : 1000, > > onInitialize : function () { > > this.start(); > > }, > > onStart : function () { > > var img = this.getItem().getElement("img"); > > var captionStr = img.get("alt") == null ? > > img.get("title") == > > null ? img.get("src").split("/").getLast() : img.get("title") : img.get > > ("alt") > > $("currentPosition").set("text", > > this.getPosition()); > > $("totalCount").set("text", this.getCount()); > > $("caption").set("text", captionStr); > > }, > > onMouseOver : function () { > > this.stop(); > > $("status").set("text", "stopped"); > > }, > > onMouseOut : function () { > > this.play(); > > $("status").set("text", "playing"); > > } > > > }).play(); > > > }); > > > </script> > > <style> > > #outer { > > padding:10px; > > background:#c0c0c0; > > width:322px; > > border:1px outset #ccc > > } > > #slide { > > list-style:none; > > list-style-type:none; > > margin:0px; > > padding:0px; > > position:relative; > > height:150px; > > width:320px; > > background:#fff; > > border:1px outset #ccc > > } > > #slide li { > > position:absolute; > > width:320px; > > text-align:center > > } > > > #slideIndicator { > > font-family:arial; > > padding:5px; > > text-align:center; > > font-size:11px; > > } > > #caption { > > font-size:16px; > > font-family:tahoma; > > font-weight:bold; > > padding:0px 0px 10px 0px; > > } > > </style> > > </head> > > <body> > > <div id="outer"> > > <div id="caption"></div> > > <ul id="slide"> > > <li><img src="images/logo_newyear.gif" /></li> > > <li><img src="images/newyear03.gif" /></li> > > <li><img src="images/googlepump.gif" /></li> > > <li><img src="images/newyear04.gif" /></li> > > <li><img src="images/newyear08.gif" /></li> > > </ul> > > > <div id="slideIndicator"> > > <span id="currentPosition"></span>/<span > > id="totalCount"></span><br / > > > </div> > > </div> > > > </body> > > </html> > > [/code] > > > please try it on your machine and please tell me what i need to change > > here so it can work for me. > > ... > > read more »
