Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Mar 2014
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    A source for a xenforo slider login bar?

    I am desperate all the time i am trying to find a source similar to xenforo and i can't find any...

    I got really frustated and if you guys help me out feel free to ask me anything i can do in return!

    Here is the toggle bar:



    I want just 2 buttons over there a login and a register once the login would be clicked it would show up the bar


    but when the register is clicked it will moved to href.

    I have seen toggle bar from the bottom or from an image to toggle down but nothing like xenforo.

    So does anyone know any website that have a source for what i need?
    Demo at XenForo Community

  • #2
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,536
    Thanks
    3
    Thanked 513 Times in 500 Posts
    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" xml:lang="en" lang="en">
    
    <head>
      <title></title>
    <style type="text/css">
    /*<![CDATA[*/
    #droppanel {
      position:absolute;z-Index:101;left:0px;top:-200px;width:100%;height:200px;background-Color:blue;color:white;text-Align:center;
    }
    
    .toggle {
      position:absolute;right:100px;bottom:-20px;width:100px;height:20px;background-Color:blue;cursor:pointer;
    }
    
    .close {
      position:absolute;right:210px;bottom:-20px;width:100px;height:20px;background-Color:blue;cursor:pointer;
    }
    
    .open {
      position:absolute;right:320px;bottom:-20px;width:100px;height:20px;background-Color:blue;cursor:pointer;
    }
    
    /*]]>*/
    </style>
    
    </head>
    
    <body>
    <div id="droppanel" >
      <br />
      <br />
      Your HTML
      <div class="open" >open</div>
      <div class="close" >close</div>
      <div class="toggle" >toggle</div>
    </div>
    >
    <script type="text/javascript">
    /*<![CDATA[*/
    
    var zxcDropPanel={
    
     Open:function(id,ud){
      var o=this['zxc'+id];
      if (o){
       o.ud=typeof(ud)=='boolean'?ud:!o.ud;
       this.animate(o,o.p,o.p[0].offsetTop,o.p[o.ud?2:3],new Date(),o.ms);
      }
     },
    
     init:function(o){
      var id=o.PanelID,ms=o.Animate,p=document.getElementById(id),b;
      if (p){
       o.p=[p,'top',0,-p.offsetHeight];
       o.ms=typeof(ms)=='number'&&ms>20?ms:1000;
       o.ud=false;
       p.style.top=o.p[3]+'px';
       b=this.bycls('toggle','*',p)[0];
       b?this.addevt(b,'click','Open',id):null;
       b=this.bycls('open','*',p)[0];
       b?this.addevt(b,'click','Open',id,true):null;
       b=this.bycls('close','*',p)[0];
       b?this.addevt(b,'click','Open',id,false):null;
       this['zxc'+id]=o;
      }
     },
    
     animate:function(o,a,f,t,srt,mS){
      clearTimeout(a[4]);
      var oop=this,ms=new Date()-srt,n=(t-f)/mS*ms+f;
      if (isFinite(n)){
       a[0].style[a[1]]=n+'px';
      }
      if (ms<mS){
       a[4]=setTimeout(function(){ oop.animate(o,a,f,t,srt,mS); },10);
      }
      else {
       a[0].style[a[1]]=t+'px';
      }
     },
    
     bycls:function (n,t,o){
      for (var o=o||document.body,c=o.getElementsByTagName(t||'*'),a=[],z0=0; z0<c.length;z0++){
       if((' '+c[z0].className+' ').match(' '+n+' ')){
        a.push(c[z0]);
       }
      }
      return a;
     },
    
     addevt:function(o,t,f,p,p1){
      var oop=this;
      o.addEventListener?o.addEventListener(t,function(e){ return oop[f](p,p1);},false):o.attachEvent?o.attachEvent('on'+t,function(e){ return oop[f](p,p1); }):null;
     }
    
    
    }
    
    zxcDropPanel.init({
     PanelID:'droppanel',
     Animate:1000
    });
    /*]]>*/
    </script></body>
    
    </html>
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/


  •  

    LinkBacks (?)

    1. 03-05-2014, 03:47 PM

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •