WEB For those familiar with JQuery

Discussion in 'OT Technology' started by Azazel28, May 11, 2009.

  1. Azazel28

    Azazel28 New Member

    Joined:
    Apr 23, 2006
    Messages:
    1,455
    Likes Received:
    0
    Location:
    Maricopa, AZ
    http://www.fubiz.net/

    I want to mimic the slide functionality of the home/user icon which uses the mootools library. Anyone with a good understand of JQuery know how this can be done or can direct me to a tutorial?
     
  2. fishbulb

    fishbulb Active Member

    Joined:
    Oct 29, 2001
    Messages:
    6,848
    Likes Received:
    4
    Location:
    md
  3. Azazel28

    Azazel28 New Member

    Joined:
    Apr 23, 2006
    Messages:
    1,455
    Likes Received:
    0
    Location:
    Maricopa, AZ
    Yea I've already searched that and I could not find similar functionality to what I need.
     
  4. shaitaan

    shaitaan New Member

    Joined:
    Jul 12, 2002
    Messages:
    49,620
    Likes Received:
    0
    Location:
    Bay Area, CA / NYC
    am i retarded, or is that just using css :o

    Code:
    <ul id="sidenav"> 
    		<li class="home"><a href="http://www.fubiz.net" title="Main News"><span>Main News</span></a></li> 
    		<li class="users"><a href="http://www.fubiz.net/category/users-stuff/" title="Users Stuff"><span>User Stuff</span></a></li>	
    	</ul> 
    
    Code:
    #sidenav{position:absolute;margin:20px 0 0 -119px;width:123px;list-style-type:none;padding:0;display:block;overflow:hidden;}
    .userfeed #sidenav,.about #sidenav,.search #sidenav{margin-top:85px;}
    #sidenav li a{display:block;height:23px;width:123px;margin-left:103px;}
    #sidenav li a span{display:none;}
    #sidenav li.home a{background:url(images/switch_main.jpg) no-repeat;margin-bottom:2px;}
    #sidenav li.users a{background:url(images/switch_userstuff.jpg) no-repeat;}
    #quick_loader{display:block;float:left;width:60px;background:#fff url(images/loading.gif) no-repeat 5px center;font-family:'Trebuchet MS',Arial,Sans-serif;padding:2px 2px 2px 25px;margin-top:15px;display:none;-moz-border-radius: 5px;-webkit-border-radius: 5px;}
    #fancyloader{display:block;-moz-border-radius: 5px;-webkit-border-radius: 5px;background:#fff url(images/loading.gif) no-repeat 5px center;width:60px;font-family:'Trebuchet MS',Arial,Sans-serif;padding:2px 2px 2px 25px;margin-top:15px;}
    #formclose{display:block;height:14px!important;width:14px!important;background:url(images/search_btn-suppr.jpg);position:absolute;margin:5px 0 0 124px}
    #formclose:hover{background-position:0!important}
    
     
  5. fishbulb

    fishbulb Active Member

    Joined:
    Oct 29, 2001
    Messages:
    6,848
    Likes Received:
    4
    Location:
    md
    Can't do the bounce and slide with just CSS, need some JS. You'll probably find in the js code somewhere the effect is applied to all span content contained by the sidenav element
     
  6. shaitaan

    shaitaan New Member

    Joined:
    Jul 12, 2002
    Messages:
    49,620
    Likes Received:
    0
    Location:
    Bay Area, CA / NYC

    so, the answer is yes, yes I am :hsd:


    :o
     

Share This Page