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{
> > > > > > >                        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 type="text/javascript">
> > > > > > > function showElement(layer){
> > > > > > >        var myLayer = document.getElementById(layer);
> > > > > > >        if(myLayer.style.display=="none"){
> > > > > > >                myLayer.style.display="block";
> > > > > > >                myLayer.backgroundPosition="top";
> > > > > > >        } else {
> > > > > > >                myLayer.style.display="none";
> > > > > > >        }
> > > > > > > }
> > > > > > > </script>
> >
> > > > > > > <!-- Mootools -->
> > > > > > > <script type="text/javascript">
> > > > > > >                window.addEvent('domready', function(){
> > > > > > >                         //-vertical
> >
> > > > > > >                        var mySlide = new Fx.Slide('v-menu2');
> > > > > > >                        mySlide.hide();
> > > > > > >                         $('toggle').addEvent('click',
> function(e){
> > > > > > >                                e = new Event(e);
> > > > > > >                                mySlide.toggle();
> > > > > > >                                e.stop();
> > > > > > >                        });
> >
> > > > > > >                });
> > > > > > >        </script>
> >
> > > > > > > </head>
> >
> > > > > > > <body>
> > > > > > > <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="#" id="toggle" class="button"><span>Click
> Here</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>
> > > > > > > </body>
> > > > > > > </html>
> >
> > > > > > > May it ll help someone who is looking for it. :)
> > > > > > > My problem is solved.
> >
> > > > > > > On Aug 19, 11:58 am, Deepali <[email protected]> wrote:
> > > > > > > >     In "mootools.svn.js" file they have given something like
> this
> >
> > > > > > > >  (start code)
> > > > > > > >         var mySlider = new Fx.Slide('myElement', {duration:
> > > 500});
> > > > > > > >         mySlider.toggle() //toggle the slider up and down.
> > > > > > > >         (end)
> >
> > > > > > > > But, how can i do it the toggle slider effect like on click
> from
> > > that
> > > > > > > > position to the down side like twitter ?
> >
> > > > > > > > On Aug 19, 11:34 am, Deepali <[email protected]> wrote:
> >
> > > > > > > > > ok, have tried the following code which is pretty similar
> to
> > > this
> > > > > > > > > effect. but the problem is the panel is sliding  from up to
> > > down
> > > > > > > > > side,but i want it to work liketwitterlogin panel which
> slides
> > > up
> > > > > to
> > > > > > > > > down.
> >
> > > > > > > > > Here is my code:
> > > > > > > > > <script type="text/javascript"
> src="mootools.svn.js"></script>
> > > > > > > > > <script type="text/javascript">
> > > > > > > > > window.addEvent('domready', function(){
> > > > > > > > >         var mySlide = new Fx.Slide('top-panel');
> >
> > > > > > > > >         $('toggle').addEvent('click', function(e){
> > > > > > > > >                 e = new Event(e);
> > > > > > > > >                 mySlide.toggle();
> > > > > > > > >                 e.stop();
> > > > > > > > >         });
> >
> > > > > > > > > });
> >
> > > > > > > > > </script>
> > > > > > > > > <style type="text/css">
> > > > > > > > > body{
> > > > > > > > >         border:0;
> > > > > > > > >         padding:0;
> > > > > > > > >         margin:0;
> > > > > > > > >         font-family:"Lucida Grande", "Lucida Sans Unicode",
> > > > > Verdana,
> > > > > > > Arial,
> > > > > > > > > Helvetica, sans-serif;
> > > > > > > > >         font-size:12px;
> > > > > > > > >         color:#555555;}
> >
> > > > > > > > > a:link, a:visited{color:#0066CC;}
> > > > > > > > > #top-panel{
> > > > > > > > >         background:#e8f3c6;
> > > > > > > > >         border-bottom:3px solid #a6c34e;
> > > > > > > > >         padding:14px 20px;
> > > > > > > > >         text-align:right;
> > > > > > > > >         width:250px;
> > > > > > > > >         height:230px;}
> >
> > > > > > > > > #sub-panel{
> > > > > > > > >         text-align:center;}
> >
> > > > > > > > > #sub-panel a{
> > > > > > > > >         width:150px;
> > > > > > > > >         float:left;
> > > > > > > > >         color:#FFFFFF;
> > > > > > > > >         text-decoration:none;
> > > > > > > > >         margin-right:30px;
> > > > > > > > >         font-weight:bold;
> > > > > > > > >         background:url(img/sub-left.png) bottom left
> no-repeat
> > > > > > > #a6c34e;}
> >
> > > > > > > > > #sub-panel a span{
> > > > > > > > >         padding:6px;
> > > > > > > > >         background:url(img/sub-right.png) right bottom
> > > no-repeat;
> > > > > > > > >         display:block;
> >
> > > > > > > > > }
> >
> > > > > > > > > strong{color:#000000;}
> > > > > > > > > .face{border:solid 2px #a6c34e; margin-left:10px;
> float:right;}
> > > > > > > > > </style>
> > > > > > > > > </head>
> >
> > > > > > > > > <body>
> > > > > > > > > <div id="top-panel">
> > > > > > > > > <p>
> > > > > > > > > <label for="username">Username or email</label>
> > > > > > > > > <input id="username" name="username" value=""
> title="username"
> > > > > > > > > tabindex="4" type="text">
> > > > > > > > > </p>
> >
> > > > > > > > > <p>
> > > > > > > > > <label for="password">Password</label>
> > > > > > > > >  <input id="password" name="password" value=""
> title="password"
> > > > > > > > > tabindex="5" type="password">
> > > > > > > > > </p>
> >
> > > > > > > > > <p>
> > > > > > > > > <input id="signin_submit"
> >
> > ...
> >
> > read more ยป




-- 
Dirar Abu Kteish
Zan Studio
Web Development Manager
Mob.:+970-597-100118
website: www.zanstudio.com

Reply via email to