How to make page refresh like this?

Hello to all. I want make a products show page.

one is index.php, another is search.php(as a jquery pop box page). index.php have some products list, click each one pass the value to search.php. search.php show products details and it also has a search box.(search.php can turn page show multi products, it looks like similar as a jqeury gallery…).

I need do any thing in search.php but without refresh index.php.

I tried many method as I can. make search.php as an iframe(but can not judge search.php height when it turn page and index.php without refresh); use jquery json pass value from index.php to search.php, then get back all page’s value to index.php. (still met some url rule trouble. php reley on url pass value, but if the value change, the two page will refresh at once. )

so. I think, ask, find, try…
I find a site like my request.

usa | Search Results | POWERWALL
(in this url, change search word after = the page will refresh)

The latest gossip, news, videos and photos on VIPs and power players on MSNBC | POWERWALL
(in this url, change search word after %3D, only the cover page refresh)

I find somthing in its source code, I think it done becasue this js rules

<script type="text/javascript"> 
var fastReplace = function() {
    var href = document.location.href;
    var siteUrl = window.location.port ? window.location.protocol+'//'+window.location.hostname +':'+window.location.port : window.location.protocol+'//'+window.location.hostname;
    var delimiter = href.indexOf('#!') !== -1 ? '#!wallState=' : '#wallState=';
 
    var pieces = href.split(delimiter);
    if ( pieces[1] ) {
        var pieces2 = pieces[1].split('__');
        if ( pieces2[1] && pieces2[1].length > 1) {
            window.location.replace( unescape(pieces2[1].replace(/\\+/g, " ")));
        }
    }
}();
</script> 

I still not know how to make it.
If in my condition. one page is index.php. another is search.php.
How to use js make a search url like
index.php#search.php?word=XXX&page=XXX
then how to pass value from one to another avoid refresh index.php?

Thanks to all.

So, when you say two pages, are you saying you would go to:
http://mysite.com/index.php
or
http://mysite.com/search.php

Or is search.php in an iframe on index.php?

If it’s the first one, there is not reason to consider index.php at all… just make the Javascript only work on search.php.

If it’s the second one, then you have a few options.

@samanime, yes, the two page’s real url like this.
I tried use search.php in an iframe on index.php? but iframe can not work well for get its real height 100%, when in its’ own refresh. (A scroll-y bar in a jquery box page looks ugly.
So I tried to use js. I am not good at js. then I tried jquery. ajax, jquery json, even jquery.load. but all the thing done will refresh the 2 pages. As I said search.php need depend on url change get values($_GET[‘word’] , $_GET[‘page’]).
So, how to solve this question? I think msnbc.com use js, put search.php?word=XXX&page=XXX as a fragment. So that turn search.php will not refresh the index.php.
But how to use js make an effection like this?
world u like to write some simple js code, show me how to post value and get value avoid refresh index.php? Thanks a lot.