It looks like you are now includug the same flle (more or less) several times.
Go to motools.net and download the mootools.1.2.3.js latest version here: http://mootools.net/download Then you need to get the Fx.Slide from the "more" builder here: http://mootools.net/more On that page, you need to mark the Fx.Slide option from within the "FX" category (and any others you think that you might need - personally I always add all the fx effects and the drag effects) This basically extends the mootools library. You don't need the other js files that you currently have. I have just followed this process - ie redownloaded mootools core, downloaded the "more" with just the fx.slide and it works correctly using the code as in the mootshell link. If you still can't get this to work, you may well have some other element on your page which is causing the javascript to break - an url would be useful to really be able to help any further. Chris On Aug 20, 7:16 am, Deepali <[email protected]> wrote: > Thanks for your reply cbolson, > I have copied the code which you have mentioned but it not working. I > mean its going on login page directly. Not showing the effect. I just > wanted to ask you for this effect i needed to add the following JS > <script type="text/javascript" src="mootools.svn.js"></script> > > Is this the new version of svn? additionally i have added the > following scripts as well > > <script type="text/javascript" src="mootools.1.2.3.js"></script> > <script type="text/javascript" src="mootools-1.2.3-core-nc.js"></ > script> > <script type="text/javascript" src="mootools-1.2.3-core-yc.js"></ > script> > > but its not working. could you please tell me which script i have to > use to get the effect as well as while not uploaded on click ll show > me login page? > > On Aug 19, 6:14 pm, cbolson <[email protected]> wrote: > > > This all works, including your html code from the earlier post, when > > running it through mooshell.net. > > The $('toggle').set('href', '#'); is not actually needed as the link > > action is being stopped by e.stop(); and, as Thierry mentioned > > earlier, the e = new Event(e); is not needed either. > > So this should be enough: > > > window.addEvent('domready', function(){ > > var mySlide = new Fx.Slide('v-menu2').hide(); > > $('toggle').addEvent('click', function(e){ > > e.stop(); > > mySlide.toggle(); > > }); > > > }); > > > Here it is in mooshell:http://mooshell.net/yzsCs/1 > > > Maybe you should try getting the latest version of mootools from > > mootools.net ?? > > > Chris > > > On Aug 19, 2:48 pm, Deepali <[email protected]> wrote: > > > > Thanks for your reply cbolson, > > > > But its not working. what can i do? > > > > On Aug 19, 5:21 pm, cbolson <[email protected]> wrote: > > > > > Hi, > > > > The e.stop(); should be enough to prevent this from happening... > > > > > Try to remove the href value as soon as the dom is ready, not wait > > > > until the link is is clicked . > > > > > So, $('toggle').set('href', '#') should be outside the $ > > > > ('toggle').addEvent('click', function(e){ function. > > > > > window.addEvent('domready', function(){ > > > > $('toggle').set('href', '#'); > > > > //-vertical > > > > var mySlide = new Fx.Slide('v-menu2').hide(); > > > > $('toggle').addEvent('click', function(e){ > > > > e = new Event(e); > > > > mySlide.toggle(); > > > > e.stop(); > > > > }); > > > > > }); > > > > > Try that and see if it works.... > > > > > Chris > > > > > On Aug 19, 2:04 pm, Deepali <[email protected]> wrote: > > > > > > Dirar, > > > > > > I have tried. but its only gonig to login page its not showing any > > > > > effect. here is the code > > > > > > <script type="text/javascript"> > > > > > window.addEvent('domready', function(){ > > > > > //-vertical > > > > > var mySlide = new Fx.Slide('v-menu2').hide(); > > > > > $('toggle').addEvent('click', function(e){ > > > > > $('toggle').set('href', '#'); > > > > > e = new Event(e); > > > > > mySlide.toggle(); > > > > > e.stop(); > > > > > });}); > > > > > > </script> > > > > > > php code > > > > > > $navlogin = "<li class='login'><a href='login.php' id='toggle' > > > > > title='Login'".classkey('Login',$classtitle)."><span>Login</span> </ > > > > > a></li>"; > > > > > > how can i get it work? please help me. > > > > > > On Aug 19, 4:45 pm, Dirar Abu Kteish <[email protected]> wrote: > > > > > > > in your case: $('toggle').set('href', '#'); > > > > > > > On Wed, Aug 19, 2009 at 2:38 PM, Deepali <[email protected]> wrote: > > > > > > > > i tried. but its not working. May be i dont know where to put it > > > > > > > exactly. could you please tell me where to put this code actually? > > > > > > > > Here is my code > > > > > > > JS > > > > > > > > <script type="text/javascript"> > > > > > > > window.addEvent('domready', function(){ > > > > > > > //-vertical > > > > > > > var mySlide = new Fx.Slide('v-menu2').hide(); > > > > > > > $('toggle').addEvent('click', function(e){ > > > > > > > $('v-menu2').getElement('a').set('href', '#'); > > > > > > > e = new Event(e); > > > > > > > mySlide.toggle(); > > > > > > > e.stop(); > > > > > > > }); > > > > > > > }); > > > > > > > </script> > > > > > > > > php- > > > > > > > /* this is for mootools slider */ > > > > > > > $navlogin = "<li class='login'><a href='login.php' id='toggle' > > > > > > > title='Login'".classkey('Login',$classtitle).">Login</a></li>"; > > > > > > > > On Aug 19, 4:27 pm, Dirar Abu Kteish <[email protected]> > > > > > > > wrote: > > > > > > > > <div id="sub-panel"> > > > > > > > > <a href="loginpagehere.php" id="toggle"><span>Show > > > > > > > > Panel</span></a> > > > > > > > > </div> > > > > > > > > > then in js something like this : > > > > > > > > $('top-panel').getElement('a').set('href', '#'); > > > > > > > > > On Wed, Aug 19, 2009 at 2:22 PM, Deepali <[email protected]> > > > > > > > > wrote: > > > > > > > > > > thanks for your reply dirar, > > > > > > > > > > how can we set default link? because the effect i am showing > > > > > > > > > that > > > > > > > > > page is index.php and on that showing login panel. so could > > > > > > > > > you please > > > > > > > > > tell me how can i show the default link ? > > > > > > > > > > On Aug 19, 4:12 pm, Dirar Abu Kteish <[email protected]> > > > > > > > > > wrote: > > > > > > > > > > set a default link with HTML and later change it with js. > > > > > > > > > > > On Wed, Aug 19, 2009 at 2:07 PM, Deepali > > > > > > > > > > <[email protected]> wrote: > > > > > > > > > > > > thierry, But its working for me. > > > > > > > > > > > > Just wanted to ask one more question here. sometimes it > > > > > > > > > > > take time > > > > > > > to > > > > > > > > > > > load JS file/page. so like twitter if i click before the > > > > > > > > > > > page is > > > > > > > > > > > completely loaded it redirect me to login page of > > > > > > > > > > > twitter. so can > > > > > > > > > > > anyone tell me how can i do that? > > > > > > > > > > > > Thanks. > > > > > > > > > > > > On Aug 19, 3:59 pm, Thierry bela nanga <[email protected]> > > > > > > > > > > > wrote: > > > > > > > > > > > > unless you use mootools 1.11, > > > > > > > > > > > > you should not use > > > > > > > > > > > > > -> e = new Event(e); > > > > > > > > > > > > > in mootools 1.2 e is already extended > > > > > > > > > > > > > On Wed, Aug 19, 2009 at 11:56 AM, Deepali > > > > > > > > > > > > <[email protected]> > > > > > > > > > wrote: > > > > > > > > > > > > > > solved my problem. > > > > > > > > > > > > > here is my code > > > > > > > > > > > > > > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 > > > > > > > > > > > > > Transitional//EN" > > > > > > > > > "http:// > > > > > > > > > > > > >www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> > > > > > > > > > > > > > <html xmlns="http://www.w3.org/1999/xhtml";> > > > > > > > > > > > > > <head> > > > > > > > > > > > > > <meta http-equiv="Content-Type" content="text/html; > > > > > > > charset=UTF-8" > > > > > > > > > /> > > > > > > > > > > > > > <title>Untitled Document</title> > > > > > > > > > > > > > <script type="text/javascript" > > > > > > > > > > > > > src="mootools.svn.js"></script> > > > > > > > > > > > > > <style type="text/css"> > > > > > > > > > > > > > body{font-family:Arial, Helvetica, sans-serif; > > > > > > > > > > > > > font-size:13px;} > > > > > > > > > > > > > /* > > > > > > > > > > > > > -------------------------------------------------------- > > > > > > > > > > > > > */ > > > > > > > > > > > > > /* BUTTON > > > > > > > > > > > > > */ > > > > > > > > > > > > > .button{ > > > > > > > > > > > > > background:url(img/button.png) -32px right > > > > > > > > > > > > > no-repeat; > > > > > > > > > > > > > color:#FFFFFF; > > > > > > > > > > > > > clear:both; > > > > > > > > > > > > > display:block; > > > > > > > > > > > > > float:left; > > > > > > > > > > > > > font-size:13px; > > > > > > > > > > > > > font-weight:bold; > > > > > > > > > > > > > height:31px; > > > > > > > > > > > > > line-height:31px; > > > > > > > > > > > > > width:auto; > > > > > > > > > > > > > margin-right:30px; > > > > > > > > > > > > > } > > > > > > > > > > > > > a.button { > > > > > > > > > > > > > text-decoration:none; > > > > > > > > > > > > > } > > > > > > > > > > > > > .button span { > > > > > > > > > > > > > background:url(img/button.png) left top > > > > > > > no-repeat; > > > > > > > > > > > > > display:block; > > > > > > > > > > > > > height:31px; > > > > > > > > > > > > > line-height:31px; > > > > > > > > > > > > > padding-left:10px; > > > > > > > > > > > > > padding-right:8px; > > > > > > > > > > > > > margin-right:20px; > > > > > > > > > > > > > } > > > > > > > > > > > > > /* > > > > > > > > > > > > > -------------------------------------------------------- > > > > > > > > > > > > > */ > > > > > > > > > > > > > /* MENU > > > > > > > > > > > > > */ > > > > > > > > > > > > > .v-menu{ > > > > > > > > > > > > > border:solid 1px #7F9FBF; > > > > > > > > > > > > > width:200px; > > > > > > > > > > > > > clear:both; > > > > > > > > > > > > > } > > > > > > > > > > > > > ul.v-menu, .v-menu li{ > > > > > > > > > > > > > padding:0; > > > > > > > > > > > > > margin:0; > > > > > > > > > > > > > list-style:none; > > > > > > > > > > > > > } > > > > > > > > > > > > > ul.v-menu{ > > > > > > > > > > > > > clear:both; > > > > > > > > > > > > > margin-top:6px; > > > > > > > > > > > > > padding:6px 10px; > > > > > > > > > > > > > } > > > > > > > > > > > > > .v-menu li a{ > > > > > > > > > > > > > > > ... > > read more »
