How do I get a link to open a specific tab on a page?

Asked 2010-08-12T16:30:43.900

13

I am working on a site for a client that has jquery driven tabbed content.

Linking to the correct page is easy enough, but the challenge is to open to the correct tab when you get there. On the about page scroll to the bottom and click on the Move it icon (the one with the truck). This takes you to the move it page. This works fine, but I would like it to be able to open the Specialty tab.

Here is the code that links to the page:

<li><a id="moveit" href="services_move_it.html">Move It</a></li>

I tried this, but it does not work correctly

<li><a id="moveit" href="services_move_it.html#specialty">Move It</a></li>

Here is the code for the tabs on the destination page:

<div id="specialty-content" class="content">
   <p class="intro">Moving Simplified specializes in moving items such items as pool tables, pianos, antiques, and anything else you can throw at us.</p> 
   <div class="video-link">
    <a href="#">Watch the Move It Specialty Videos Now.</a>
   </div>
   <p>  Moving such items is more complicated than most would understand, and is an art form in itself.  We take pride in making sure that your priceless possessions are delivered damage free.  The employees sent to move your belongings are highly experienced in these types of items.  They will always  be well equipped to complete the move with the most up to date technology in the moving industry.</p><p> We will always pad and wrap each individual piece, as well as provide custom crates to ensure the safety of your pool table slate.</p>
   <div class="



        
            2 Answers
            
            
                
                    
                        
                            
                            
                        
                        0
                        
                            
                            
                        
                        
                    
                    
                        
                        I need JS code to handle a hashpart. It could look somewhat like this.

handleHashPart = function(tabs) {
  var hashPart = window.location.hash;
  if (! hashPart || hashPart.length === 0) {
    return;
  }
  tabs.each(function() {
    var link = $(this);
    if (link.attr('href') == hashPart) {
      link.trigger('click');
      return false;
    }
    return true;
  });
};

handleHashPart($('a.tab'));


Put this after you attach your handler. Now your link should work.

                        
                        
                            answered 2010-08-12T16:51:22.613
                            
                        
                        
                            
                                
                                
                            
                        
                        
                            
                            
                            
                                
                                
                            
                            
                        
                    
                
            
            
            
                
                    
                        
                            
                            
                        
                        0
                        
                            
                            
                        
                        
                    
                    
                        
                        $('.LinkSelector').click(function(){
   $( "#tabs" ).tabs("select", "#tabs-1" );
  });


above code is also helpful.

                        
                        
                            answered 2012-12-13T10:24:29.873
                            
                        
                        
                            
                                
                                
                            
                        
                        
                            
                            
                            
                                
                                
                            
                            
                        
                    
                
            
            
        

        
        
            Your Answer