- Postagens: 146
- Obrigados Recebidos: 0
html5 History API e AJAX
- glauciarezende
-
Autor do Tópico
- Offline
- JCB! Senior
-
Menos
Mais
12 anos 8 meses atrás #85150
por glauciarezende
glauciarezende created the topic: html5 History API e AJAX
Olá,
Gente, sabe a questão de mudar a url sem o uso das hash tags? Então, eu implementei, ou tentei, um esquema neste site: <!-- w -->[url=http://www.odontologiadinamica.com.br" onclick="window.open(this.href);return false;]www.odontologiadinamica.com.br[/url]<!-- w --> acontece que quando vou copiar e apontar para uma url, exemplo, abro uma nova aba no browser e aponto para http://www.odontologiadinamica.com.br/equipe-dentista ele dá erro 404... uai, e também, o f5 está dando 404.
Fiz na index.php este código:
<script type="text/javascript">
$(document).ready(function() {
var $ = jQuery;
$('[data-link="home"]').click(function() {
window.history.pushState( location.href, "Home Care", "/home-care" );
document.title = "Home Care Odontológico";
});
$('[data-link="tratamentos"]').click(function() {
window.history.pushState ( location.href, "Tratamentos Odontológico", "tratamentos-odontologicos" );
document.title = "Tratamentos Odontológico";
});
$('[data-link="equipe"]').click(function() {
window.history.pushState( location.href, "Equipe de Dentistas", "/equipe-dentista" );
document.title = "Equipe de Dentistas";
});
$('[data-link="consulta"]').click(function() {
window.history.pushState( location.href, "Marcar Consulta com Dentista", "/marcar-consulta-dentista" );
document.title = "Marcar Consulta com Dentista";
});
$('[data-link="mapa"]').click(function() {
window.history.pushState( location.href, "Área do Cliente", "/area-do-cliente" );
document.title = "Área do Cliente";
});
});
$(function() {
$(".menu ul li a, a.topo, a.seta-link").click(function() {
$("html, body").animate({scrollTop: $(".pagina-"+$(this).data('link')).offset().top+"px"}, 800);
return false;
});
})
</script>
A página comporta-se como um estilo "one page", ou seja, usa scroll vertical ao clicar nos links do menu. Nos links do menu, há um data-link, assim ó: <a href="#" data-link="equipe" title="Equipe de Dentistas">Equipe</a> E a index.php tem os includes do php para páginas estáticas.
Não fiz mudanças no .htacess... quer dizer, só no que diz respeito a url amigáveis.
E, minha dúvida esdrúxula: Este sistema que estou tentando implementar ele faz a mudança legítima para os buscadores? Ou isso só acontece no browser do usuário? Tem que haver alguma linha especial no .htacess para os buscadores?
Então, é isso... como corrigir o F5 (dá erro 404) e as urls diretas na nova aba (erro 404) e da forma que está os buscadores vão entender que <!-- w -->[url=http://www.odontologiadinamica.com.br" onclick="window.open(this.href);return false;]www.odontologiadinamica.com.br[/url]<!-- w --> é diferente de <!-- w --> www.odontologiadinamica.com.br/equipe-dentistas <!-- w -->?
Desde já, meu muito obrigado pela ajuda!
Gente, sabe a questão de mudar a url sem o uso das hash tags? Então, eu implementei, ou tentei, um esquema neste site: <!-- w -->[url=http://www.odontologiadinamica.com.br" onclick="window.open(this.href);return false;]www.odontologiadinamica.com.br[/url]<!-- w --> acontece que quando vou copiar e apontar para uma url, exemplo, abro uma nova aba no browser e aponto para http://www.odontologiadinamica.com.br/equipe-dentista ele dá erro 404... uai, e também, o f5 está dando 404.
Fiz na index.php este código:
<script type="text/javascript">
$(document).ready(function() {
var $ = jQuery;
$('[data-link="home"]').click(function() {
window.history.pushState( location.href, "Home Care", "/home-care" );
document.title = "Home Care Odontológico";
});
$('[data-link="tratamentos"]').click(function() {
window.history.pushState ( location.href, "Tratamentos Odontológico", "tratamentos-odontologicos" );
document.title = "Tratamentos Odontológico";
});
$('[data-link="equipe"]').click(function() {
window.history.pushState( location.href, "Equipe de Dentistas", "/equipe-dentista" );
document.title = "Equipe de Dentistas";
});
$('[data-link="consulta"]').click(function() {
window.history.pushState( location.href, "Marcar Consulta com Dentista", "/marcar-consulta-dentista" );
document.title = "Marcar Consulta com Dentista";
});
$('[data-link="mapa"]').click(function() {
window.history.pushState( location.href, "Área do Cliente", "/area-do-cliente" );
document.title = "Área do Cliente";
});
});
$(function() {
$(".menu ul li a, a.topo, a.seta-link").click(function() {
$("html, body").animate({scrollTop: $(".pagina-"+$(this).data('link')).offset().top+"px"}, 800);
return false;
});
})
</script>
A página comporta-se como um estilo "one page", ou seja, usa scroll vertical ao clicar nos links do menu. Nos links do menu, há um data-link, assim ó: <a href="#" data-link="equipe" title="Equipe de Dentistas">Equipe</a> E a index.php tem os includes do php para páginas estáticas.
Não fiz mudanças no .htacess... quer dizer, só no que diz respeito a url amigáveis.
E, minha dúvida esdrúxula: Este sistema que estou tentando implementar ele faz a mudança legítima para os buscadores? Ou isso só acontece no browser do usuário? Tem que haver alguma linha especial no .htacess para os buscadores?
Então, é isso... como corrigir o F5 (dá erro 404) e as urls diretas na nova aba (erro 404) e da forma que está os buscadores vão entender que <!-- w -->[url=http://www.odontologiadinamica.com.br" onclick="window.open(this.href);return false;]www.odontologiadinamica.com.br[/url]<!-- w --> é diferente de <!-- w --> www.odontologiadinamica.com.br/equipe-dentistas <!-- w -->?
Desde já, meu muito obrigado pela ajuda!
Please Entrar ou Registrar to join the conversation.