IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

jQuery Discussion :

cherche solution avec jQuery Address Tabs


Sujet :

jQuery

  1. #1
    Membre averti
    Profil pro
    Inscrit en
    Janvier 2007
    Messages
    11
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Janvier 2007
    Messages : 11
    Par défaut 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 : Sélectionner tout - Visualiser dans une fenêtre à part
    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 : Sélectionner tout - Visualiser dans une fenêtre à part
    <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

  2. #2
    Membre averti
    Profil pro
    Inscrit en
    Janvier 2007
    Messages
    11
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Janvier 2007
    Messages : 11
    Par défaut
    je me permet de faire remonter ce post. Je n'ai toujours pas de solution à mon probleme...
    Dois-je abandonner ce plug-in ? me rabattre sur autre chose ?

    En fait, je créé un site où doit figurer un lecteur mp3 (en flash) intégré à l'entete de page. Celui-ci ne devant pas etre rafraichi pour garder une lecture continue, j'avais pensé aux tabs.

    j'ai retenu "jQuery Address Tabs" car il permet l'utilisation des boutons avance et retour du navigateur...

    Si quelqu'un pouvait m'éclairer !

    merci,

    arno

Discussions similaires

  1. Réponses: 4
    Dernier message: 06/09/2014, 13h38
  2. jQuery UI Tabs : bug avec option FX
    Par h4mzt3r dans le forum jQuery
    Réponses: 2
    Dernier message: 07/02/2012, 10h26
  3. cherche solution hebergement avec Graphviz
    Par menthol34 dans le forum Hébergement
    Réponses: 1
    Dernier message: 04/03/2010, 11h36
  4. [Système] Cherche solution pour coupler PHP avec UNIX
    Par Delphy113 dans le forum Langage
    Réponses: 4
    Dernier message: 05/10/2006, 16h32
  5. Navigation avec la touche TAB
    Par wishnight dans le forum AWT/Swing
    Réponses: 3
    Dernier message: 27/10/2004, 10h02

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo