Chris, its working now. what i did is
i just replace this to
e.stop();
mySlide.toggle();
this.
e = new Event(e);
mySlide.toggle();
e.stop();
And its working. and i have checked it on where actually i wanted to
impliment it. Thnaks a lot.
but still one problem is remaining while loading the js it show me the
hidden part(two text box or the content) and after the page gets load.
it works fine. why is it so?
Anyways thaks a lot.
On Aug 20, 1:56 pm, Deepali <[email protected]> wrote:
> i have added thr following
>
> <script type="text/javascript" src="mootools-1.2.3.1-more.js"></
> script>
> <script type="text/javascript" src="mootools-1.2.3-core.js"></script>
>
> or
>
> <script type="text/javascript" src="mootools-1.2.3.1-more.js"></
> script>
> <script type="text/javascript" src="mootools-1.2.3-core.js"></script>
> <script type="text/javascript" src="mootools.svn.js"></script>
>
> but its not working. is it working on your m/c without mooshells?
>
> On Aug 20, 1:25 pm, cbolson <[email protected]> wrote:
>
> > Hi,
> > You haven't included the mootools core file.
> > You need both the "core" and the "more" files.
>
> > Chris
>
> > On Aug 20, 10:19 am, Deepali <[email protected]> wrote:
>
> > > I have downloaded new version. But still no difference. I have two
> > > pages(trail pages)
> > > mootoolslogin.php
> > > <!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-1.2.3.1-more.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{
> > > color:#555555;
> > > font-weight:bold;
> > > display:block;
> > > border-top:solid 1px #DEDEDE;
> > > padding:4px;
> > > text-decoration:none;
> > > }
> > > .v-menu li a:hover{
> > > color:#999999;
> > > }
> > > </style>
> > > <script>
> > > window.addEvent('domready', function(){
> > > var mySlide = new Fx.Slide('v-menu2').hide();
> > > $('toggle').addEvent('click', function(e){
> > > e.stop();
> > > mySlide.toggle();
> > > });
>
> > > });
>
> > > </script>
>
> > > </head>
> > > <body>
>
> > > <form action='<?$PHP_SELF;?>' name="messageFrm" method="post">
> > > <table width="600" border="0" align="center" cellpadding="0"
> > > cellspacing="0">
> > > <tr>
> > > <td width="50%"><h2>Login</h2></td>
> > > </tr>
> > > <tr>
> > > <td width="50%" valign="top">
> > > <a href="loginpagehere.php" id="toggle"><span>Show Panel</span></a>
> > > <div style="clear:both">
> > > <ul id="v-menu2" class="v-menu">
> > > <li>
> > > <label for="username">Username or email</label>
> > > <input id="username" name="username" value="" title="username"
> > > tabindex="4" type="text">
> > > </li>
> > > <br/>
> > > <li>
> > > <label for="password">Password</label>
> > > <input id="password" name="password" value="" title="password"
> > > tabindex="5" type="password">
> > > </li>
> > > <br/>
> > > <li>
> > > <input id="signin_submit" value="Sign in" tabindex="6" type="submit">
> > > </li>
> > > <li>
> > > <input id="remember" name="remember_me" value="1" tabindex="7"
> > > type="checkbox">
> > > <label for="remember">Remember me</label>
> > > </li>
> > > <li>
> > > </li>
> > > </ul>
> > > </div></td>
> > > </tr>
> > > </table>
> > > </form>
> > > </body>
> > > loginpagehere.php
>
> > > <table width="600" border="0" align="center" cellpadding="0"
> > > cellspacing="0">
> > > <tr>
> > > <td width="50%"><h2>Login</h2></td>
> > > </tr>
> > > <tr>
> > > <td width="50%" valign="top">
> > > <a href="loginpagehere.php" id="toggle"><span>Show Panel</span></a>
> > > <div style="clear:both">
> > > <ul id="v-menu2" class="v-menu">
> > > <li>
> > > <label for="username">Username or email</label>
> > > <input id="username" name="username" value="" title="username"
> > > tabindex="4" type="text">
> > > </li>
> > > <br/>
> > > <li>
> > > <label for="password">Password</label>
> > > <input id="password" name="password" value="" title="password"
> > > tabindex="5" type="password">
> > > </li>
> > > <br/>
> > > <li>
> > > <input id="signin_submit" value="Sign in" tabindex="6" type="submit">
> > > </li>
> > > <li>
> > > <input id="remember" name="remember_me" value="1" tabindex="7"
> > > type="checkbox">
> > > <label for="remember">Remember me</label>
> > > </li>
>
> > > </ul>
> > > </div></td>
> > > </tr>
> > > </table>
> > > As you can see there is nothing that can crack the js. now the status
> > > is as soon as i click on the Show Panel link it goes to loginpagehere
> > > page. It means the effect is not yet working.On your m/c, is it
> > > working without using mooshells?
>
> > > On Aug 20, 12:52 pm, cbolson <[email protected]> wrote:
>
> > > > 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.
>
> ...
>
> read more »
