title: Changing Tab on Image Click
body: <p>I try for some time now to set the active Tab of this theme when the user clicks an image (above the tabs).</p>
  
  <p><a href="http://www.elegantthemes.com/preview/Nova/" rel="nofollow noreferrer">http://www.elegantthemes.com/preview/Nova/</a></p>
  
  <p><img src="https://i.stack.imgur.com/o0qLm.png" alt="http://imageupload.org/en/file/192843/tabclickexample.png.html"></p>
  
  <p>I found the normal tab change code in the scripts.php, but I have no idea of how to change it to make it work with clicking any image that are above the tabs.</p>
  
  <pre><code>            $service_li.find('a').click(function(){
                  var $a = jQuery(this),
                      next_tab = $a.parent('li').prevAll().length,
                      next_tab_height = $service_tabs.find('&gt;div').eq(next_tab).outerHeight();
  
                  if ( next_tab != active_tab ) {
                      $service_tabs.css({height:next_tab_height});
                      $service_div.filter(':visible')
                          .animate( {opacity: 'hide'},500, function(){
                              jQuery(this).parent().find('&gt;div').eq(next_tab).animate( {opacity: 'show'},500 );
                          } )
                          ;
                      $service_li.removeClass(active_tabstate).filter(':eq('+next_tab+')').addClass(active_tabstate);
                      active_tab = next_tab;
                  }
  
                  return false;
              }).hover(function(){
                  if ( !jQuery(this).parent('li').hasClass(active_tabstate) &amp;&amp; !is_ie ) jQuery(this).fadeTo('slow',.7);
              }, function(){
                  if (!is_ie) jQuery(this).fadeTo('slow',1);
              });
          }
  </code></pre>
  
  <p>Maybe someone can help out ?</p>