Question

Hello I have site where I show/hide divisions that are loaded by default at start. But the problem is that when I refresh page it is always going back to main division. Is there any way I can do something like mysite/#news mysite/#about?

Code that I have:

        $('a#btnNews').click(function()
        {
            $('#divabout').hide();
            $('#divnews').fadeIn();
            $('#pagetimer').load('scripts/loadtimer.php');
            return false;
        });

        $('a#btnAbout').click(function()
        {
            $('#divrooster').hide();
            $('#divabout').fadeIn();
            $('#pagetimer').load('scripts/loadtimer.php');
            return false;
        });

Answer 1

Throughout this you can use window.location.hash instead.

if (location.hash != "") {
  $('a#'+location.hash).click();
}
$('a#btnNews').click(function()
{
  $('#divabout').hide();
  location.hash = 'btnNews';
  $('#divnews').fadeIn();
  $('#pagetimer').load('scripts/loadtimer.php');
  return false;
});
$('a#btnAbout').click(function()
{
  $('#divrooster').hide();
  location.hash = 'btnAbout';
  $('#divabout').fadeIn();
  $('#pagetimer').load('scripts/loadtimer.php');
  return false;
});

Make sure to put all this inside either $(function(){}); or $(document).ready(function(){});!

You can either use $('a#'+location.hash).click(); or you can change the hash to fade in the targeted div directly.

You can also use e.preventDefault() instead of return false;. (It also works better) E.g.

$('a#btnNews').click(function(e) {
e.preventDefault();
...
});