Hoping someone can help me with this please.
Having a strange problem with tabbed content not loading correctly unless I refresh the page.

I have a main navigation menu for the site which has some links which load a specific tab when they are clicked, that part works fine.
On the page with the tabbed section (services page) I also have the tabbed menu which loads the correct tabs when its supposed to.

The problem is when you are on the services page, if you click the links to the tabbed section from the main site navigation it does not work unless I reload the page for the browser after I've clicked the link.


Here's the .js which I'm using to make the tabbed section work.

Code:
<script type="text/javascript">
                            $(function () {
    $(".tab_content").hide().first().show();
    $(".tab_widget li:first").addClass("active");

    $(".tab_widget a").on('click', function (e) {
        e.preventDefault();
        $(this).closest('li').addClass("active").siblings().removeClass("active");
        $($(this).attr('href')).show().siblings('.tab_content').hide();
    });

    var hash = $.trim( window.location.hash );

    if (hash) $('.tab_widget a[href$="'+hash+'"]').trigger('click');
	

});
                        </script>
Can anyone tell me how I can amend this to make it work from the main menu clicks even if the user is on the tabbed page?

Any help as always very much appreciated.

Thanks