cherche solution avec jQuery Address Tabs

Bonjour,
Je commence le JS et jquery, je cherche à faire une interface avec des onglets qui vont appeler des pages externes.
J'ai choisi tabs index (voir ici : www.asual.com/jquery/address/samples/tabs/) pour permettre l'utilisation du bouton avant arriere du navigateur

Voici le code de la page principale :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
<!DOCTYPE html>
<html>
    <head>
        <title>jQuery Address Tabs 2</title>
        <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
        <link type="text/css" href="jquery-ui-1.8.1.custom.css" rel="stylesheet">
        <link type="text/css" href="styles.css" rel="stylesheet">
        <script type="text/javascript" src="jquery-1.4.2.min.js"></script>
        <script type="text/javascript" src="jquery-ui-1.8.custom.min.js"></script>
        <script type="text/javascript" src="jquery.address-1.2.min.js?wrap=true"></script>
        <script type="text/javascript">
            var tabs;
            // Address handler
            $.address.init(function(event) {
 
                // Tabs setup
                tabs = $('#tabs')
                    .tabs({
                        // Content filter
                        load: function(event, ui) {
                            $(ui.panel).html($('#tabs div:first', ui.panel).html());
                        },
                        selected: $('#tabs ul:first a').index($('a').filter('[rel=address:' + event.value + ']')),
                        fx: { opacity: 'toggle' }
                    })
                    .css('display', 'block');
 
            }).change(function(event) {
 
                // Sets the page title
                $.address.title($.address.title().split(' | ')[0] + ' | ' + $('a').filter('[rel=address:' + event.value + ']').text());
 
            }).externalChange(function(event) {
 
                // Select the proper tab
                tabs.tabs('select', $('a').filter('[rel=address:' + event.value + ']').attr('href'));
 
            });
 
            // Hides the tabs during initialization
            document.write('<style type="text/css"> #tabs { display: none; } </style>');
 
        </script>
    </head>
    <body>
        <div class="page">
           <div id="tabs" >
              <ul>
                  <li ><a href="#Overview" title="Overview" rel="address:/">Accueil</a></li>
		 <li ><a href="./home.php" title="Home" rel="address:/home.php">Présentation</a></li>
		 <li ><a href="./agenda.php" title="Agenda" rel="address:/agenda.php">Agenda</a></li>
		 <li ><a href="./galerie.php" title="Galerie" rel="address:/galerie.php">Galerie</a></li>
	     </ul>
                <div id="Overview" class="ui-tabs-panel ui-widget-content">
                	<p>C'est l'accueil</p>
                </div>
            </div>
        </div>
    </body>
</html>

Tout me convient, mis-à-part la page galerie.php qui interroge une base de données qui retournent des pages du type : galerie.php?galerie=5
Mais impossible d'afficher cette page dans la "frame" à cause de son URL

Cette URL générée par la BDD, si elle ne figure pas en "dur" dans le menu (commun à toutes les onglets), n'affichera pas la galerie dans la "frame".

en test cela donne ça ...
si j'ai ça dans mon menu :

Code:

<li ><a href="galerie.php?galerie=5" title="Test" rel="address:/galerie.php?galerie=5">Test</a></li>

ça marche; si je le retire, il ne retrouve pas l'onglet et cela ne s'affiche pas.

J'ai fait plein de topics, mais mon niveau en Jquery me permet pas de bien cerner mon problème.

Merci à celui qui passera par là car je suis bloqué...
arno