jquery javascript: ajout de l'historique de navigation de retour avec le hashtag?

J'ai un lien sur mon site qui dit "plein écran Google Map". Une fois que je clique dessus, je charge une carte google map dans un 100% de large et 100% élevé en position fixe div conteneur. Lorsque le lien est cliqué, j'ai aussi ajouter un #de carte de hachage.

Est-il possible de faire le bouton précédent du navigateur de travailler avec cela? C'est, si je clique sur ce lien, j'ai ajouter #map à mon adresse actuelle. Une fois que je clique sur le bouton de retour, le n ° de la carte de hachage est supprimé et le div récipient avec la carte de google est supprimé ou cachés.

Est que d'une certaine façon possible?

edit:

$('.showMapLink').live('click', function() {

    $('#mapContainer').fadeIn('fast', function () {
        loadMap("mapContainer");

        top.location.hash = "map";
        $(window).bind( 'hashchange', function( event ) {
            $('#mapContainer').fadeOut('fast', function () {
                $(this).children().remove();
            })
        });

    });

});

OriginalL'auteur matt | 2011-03-21

  1. 7

    Une grande ressource et le plugin est en Ben Almans barbecue plugin, Il vous aidera à définir et lire le hash de la partie de l'url (par exemple, voir pushState et getState) et il fournit un hashchange événement qui fonctionne sur tous les navigateurs.

    Poignée de la hashchange de l'événement et de faire de votre traitement. Vous avez besoin de déclencher manuellement l'événement la première fois le chargement de la page.

    $(document).ready(function(){

    $(window).bind( 'hashchange', function( event ) {

        //show/hide map here. this will vary depending on what you use in the url

        if (window.location.hash == "map"){
            $('#mapContainer').fadeIn('fast', function () {
               loadMap("mapContainer");
            });
        } else {
            $('#mapContainer').fadeOut('fast', function () {
                $(this).children().remove();
            })
        }

    });

    $('.showMapLink').live('click', function() {
        top.location.hash = "map";
    });

    $(window).trigger("hashchange");

});
    je vous remercie. J'ai presque eu de travail. J'ai mis à jour mon post. Toute idée de ce que je fais mal? Je suis en application de la "#map" de hachage avant de me lier la hashchange auditeur, toutefois, il ne pas fonctionner correctement. Une idée?
    vous avez besoin de déclencher manuellement l'hashchange cas la première fois le chargement de la page (ou une fois que vous avez lié l'auditeur), par la suite, le hashchange événements déclenche à chaque fois que vous la modifiez. J'ai mis à jour ma réponse.
    Je vous remercie. Il n'y a aucune façon de résoudre ce problème sans l'aide de ce plugin. J'ai juste besoin de cette chose une fois sur ma page entière et 53kb pour ce plugin jQuery est déjà pas mal.
    la version compacte est seulement de 4 ko. github.com/cowboy/jquery-bbq/raw/v1.2.1/jquery.ba-bbq.min.js. Plus d'infos ici: benalman.com/projects/jquery-bbq-plugin. Il a aussi un autre plugin qui fournit simplement la hashchange événement. Son seul 1,5 KB. Voir benalman.com/projects/jquery-hashchange-plugin. Comme expliqué sur cette page, vous avez besoin du plugin pour fournir cette fonctionnalité dans les navigateurs plus anciens.
    viens de voir votre code edit j'ai donc mis à jour ma réponse à inclure un exemple plus complet.

    OriginalL'auteur Geoff Appleford

  2. 0

    Probablement, la moitié de la réponse à votre question ici: jQuery retrait de la valeur de hachage à partir de l'URL

    OriginalL'auteur Fortega

  3. 0

    Oui, c'est possible (avec recentish) les navigateurs.

    Voir document.location.hash pour ajouter #map à l'URL courante.

    Enregistrer un onhashchange écouteur d'événement à rechercher des changements, mais notez que lorsque vous ensemble la balise, elle soulève également d'un tel événement. Par conséquent, vous devez jeter un événement qui contient le même hash que celui que vous venez de définir.

    Sinon, regardez le jQuery l'histoire de plugin, qui a des solutions de contournement pour les anciens navigateurs.

    OriginalL'auteur Alnitak