溢出：隐藏 - > PHP DIV滚动？

So I have a website that navigates by scrolling through a pane of DIVs that's wrapped inside a main DIV via. JQuery/javascript: http://plugins.jquery.com/project/ScrollTo

E.g.

<div id="content" style:"overflow:hidden; width 800px;">
   <div id="home" class="page"></div>
   <div id="about" class="page"></div>
   <div id="support" class="page"></div>
</div>

It navigates and scrolls fine, but attempting to provide dynamic URLs for the pages without breaking the scrolling feature (e.g. mywebsite.com?p=home) brings a bit of trouble.

So depending on what the GET request returns, I want the PHP script to automatically set the scroll position on page load; as the scroll bars are hidden, and can only be set via. javascript.

What is the best method for this?

Here is something I use to get the $_GET vars:

function getQueryParams(qs) {
    qs = qs.split("+").join(" ");
    var params = {},
        tokens,
        re = /[?&]?([^=]+)=([^&]*)/g;

    while (tokens = re.exec(qs)) {
        params[decodeURIComponent(tokens[1])]
            = decodeURIComponent(tokens[2]);
     }

    return params;
}

var $_GET = getQueryParams(document.location.search);

$(document).ready(function(){
    $('html,body').animate({
        scrollTop: $('#'+$_GET.p).offset().top},
        'slow');
});

Probably something like this

<script>
    var goTo = '<?php echo (isset($_GET['p']) ? $_GET['p'] : "default_value"); ?>';
    (function($){
        $(document).ready(function(){
            functionThatScrolls(goTo);
        });
    }(jQuery));
<script>

I would do it like this, just print the value of the $_GET['p'] into the script, just make sure to print a default value, and maybe sanitize the value of p someone could insert something into it.

hope it helped.

May I suggest simply using plain old anchor tags?

The way you've described your site doesn't seem to need all this js magic in order to achieve the effect you're looking for...

<div>

  <a name="home">
    <div>
    </div>
  </a>

  <a name="pix">
    <div>
    </div>
  </a>

  <a name="about us">
    <div>
    </div>
  </a>

  <a name="contact">
    <div>
    </div>
  </a>

</div>

Then, links to http://www.mywebsite.com/#home will go do what you're looking for, plus google will index it as a subsection of http://www.mywebsite.com/

I think if you put a ! before your anchor tag names, google will actually index each as a separate page.

EDIT: Go here, and scroll down to "Step-by-step guide".