/ / Texto personalizado para o menu de busca detalhada Botão “Voltar” [Fundação 6] - zurb-foundation, zurb-foundation-6

Texto personalizado para o menu de busca detalhada Botão “Voltar” [Fundação 6] - zurb-foundation, zurb-foundation-6

Enquanto eu sei que posso usar botão de retorno de dados para alterar o texto nos meus menus expandidos, é possível alterá-los para refletir o que quer que os pais da pesquisa seja?

Por exemplo, o menu de pesquisa funciona assim: Exemplo 1

E eu gostaria que funcionasse como tal: Exemplo 2

Espero que isso faça sentido e deixe-me saber se posso esclarecer. Obrigado por qualquer insight que você possa fornecer.

Respostas:

5 para resposta № 1

Há algumas maneiras de fazer isso, mas o mais direto parece ser algo assim:

1) Use Opções de drill-down de fundações para definir um novo botão geral de retorno. por exemplo. data-back-button="<li class="js-drilldown-back"><a class="new-back"></a></li>"

Isso cuida do estilo com .js-drilldown-back e faz com que funcione como um botão de volta sem JavaScript adicional. Também adiciona uma nova classe ao a para mais tarde usar o texto.

2) Para alterar o texto você pode usar o jQuery, talvez algo assim:

$(".new-back").each(function(){
var backTxt = $(this).parent().closest(".is-drilldown-submenu-parent").find("> a").text();
$(this).text(backTxt);
});

Tudo isso faz apressar a estrutura do menu para descobrir qual era o texto do link original e copiá-lo para o novo botão Voltar.

Isso deve funcionar para todos os níveis de uma pesquisa como neste exemplo: http://codepen.io/tymothytym/pen/GWbXap

PARA SUA INFORMAÇÃO: Há alguns problemas de uso moderado com o uso das mesmas etiquetas para apontar para frente e para trás nos menus, pois os usuários podem achar isso confuso, especialmente em muitos níveis. Você já deve ter considerado isso, eu o menciono apenas por completo.