jQuery questão elemento selector

Question

O meu problema é um pouco mais complexa.

Eu tenho o seguinte código:

$(document).ready(function() {

    var hash = window.location.hash.substr(1);
    var href = $('#nav li a').each(function(){
        var href = $(this).attr('href');
        if(hash==href.substr(0,href.length-5)){
            var toLoad = hash+'.html #content';
            $('#content').load(toLoad)
        }                                           
    });

    $('#nav li a').click(function(){

        var toLoad = $(this).attr('href')+' #content';
        $('#content').hide('fast',loadContent);
        $('#load').remove();
        $('#wrapper').append('<span id="load">LOADING...</span>');
        $('#load').fadeIn('normal');
        window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);
        function loadContent() {
            $('#content').load(toLoad,'',showNewContent())
        }
        function showNewContent() {
            $('#content').show('normal',hideLoader());
        }
        function hideLoader() {
            $('#load').fadeOut('normal');
        }
        return false;

    });

});

Ok, em primeiro lugar, não sou eu quem codificado, então eu realmente não entendo o que ele faz e eu também tentei mudar isso, mas eu não consegui. O código irá selecionar um link 'li nav' e exibir a página de uma forma AJAX, isso significa sem recarregá-lo. Ele faz isso corretamente :) Agora, tudo o que eu quero fazer isso para adicionar um fancybox para registrar os usuários. Para fazer isso devo acrescentar o seguinte código.

$("a#reg").fancybox({
    'hideOnContentClick': false
});

Agora eu só colocar o código em $ document.readyfunction e as obras Caixa extravagante como deveria, também as ligações li nav funciona bem. Então, onde está o problema? quando eu clicar em um link 'li nav' e carregar o conteúdo e, em seguida, clique novamente no link da casa, (eu voltar para a primeira página), a caixa de fantasia obras não mais. Eu sei que é muito sensível por isso pode ser que você tem mau-entendido, então deixe-me explicar isso de outra maneira. Eu tenho tanto o seletor do 'li nav' eo seletor da ligação Caixa extravagante, o que é o melhor método para fazê-los trabalha em conjunto ??

Além disso, alguém pode me explicar o que o código faz bem.
Obrigado.

Answer 1

Ok ... Aqui está o que o código faz:

    var hash = window.location.hash.substr(1);
    var href = $('#nav li a').each(function(){
        var href = $(this).attr('href');
        if(hash==href.substr(0,href.length-5)){
                var toLoad = hash+'.html #content';
                $('#content').load(toLoad)
        }                                                                                       
    });

Esta primeira parte terá a de hash da página atual, verifique se um dos "li nav" links extremidades com esse hash (5 caracteres esperado) e se for o caso, irá carregar o elemento #content da página hash + ".html" no elemento #content da página atual (Acho que é uma div).

Imagine que você carregar a url " http: //.../page1.html#page2 ". Página1 será carregado e, em seguida, #content de page2.html será carregado por uma chamada ajax em #content de Página1.

    $('#nav li a').click(function(){

        var toLoad = $(this).attr('href')+' #content';
        $('#content').hide('fast',loadContent);
        $('#load').remove();
        $('#wrapper').append('<span id="load">LOADING...</span>');
        $('#load').fadeIn('normal');
        window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);
        function loadContent() {
                $('#content').load(toLoad,'',showNewContent())
        }
        function showNewContent() {
                $('#content').show('normal',hideLoader());
        }
        function hideLoader() {
                $('#load').fadeOut('normal');
        }
        return false;

    });

Isto irá adicionar o seguinte comportamento para ligações "li nav":. Quando clicado, mostram uma "mensagem de carregamento" e carregar o #content da página de destino no elemento #content da página atual

Eu não tenho nenhuma idéia por que este script, apesar de ser terrível, faria com que seu fancybox para não mostrar. Meu palpite é que os links "li nav" irá carregar o conteúdo com uma chamada ajax e isso não irá afectar a sua fancybox, que já está carregado, mas quando você clica no link para casa, a página é completamente recarregado eo código fancybox não é executado, por uma razão. Você pode verificar que, adicionando um alerta simples:

alert("initializing fancybox");
$("a#reg").fancybox({
    'hideOnContentClick': false
});

Se a página inteira é recarregada quando você clica no link para casa, e este alerta não pop-up, você encontrou a causa do seu problema.