/ / Zurb Foundation 4, Off Canvas e Shopify - zurb-foundation, shopify, líquido

Zurb Foundation 4, Off Canvas e Shopify - zurb-foundation, shopify, líquido

Oi eu estou tentando obter zurb fundação 4 para tero menu móvel off canvas funciona na minha loja shopify. o problema que estou tendo é que ele está exibindo o botão de menu bem, mas não está provocando nada quando clicado e a barra lateral pré-carregada é visível na área de trabalho

o código que usei até agora é

<!-- mobile only side bar -->
<header class="row">
<div class="large-8 columns small-2">
<p class="show-for-small">
<a class="sidebar-button button" id="sidebarButton" href="#sidebar" >Menu</a>
</p>
</div>
<section id="sidebar" role="complementary">
<nav id="sideMenu" role="navigation">
<ul id="sideMainNav" class="nav-bar">
<li><a href="">test</a></li>
<li><a href="">Two</a></li>
<li><a href="">Three</a></li>
<li><a href="">Four</a></li>
</ul>
</nav>
</section>
</header>
<!-- /mobile -->


<!-- Check for Zepto support, load jQuery if necessary -->
<script>
document.write("<script src=/"
+ ("__proto__" in {} ? "zepto" : "jquery")
+ ".js></script>");
</script>

{{ "zepto.js" | asset_url | script_tag }}
{{ "foundation.min.js" | asset_url | script_tag }}
<script>
$(document).foundation();
</script>
{{ "jquery.offcanvas.js" | asset_url | script_tag }}

Respostas:

3 para resposta № 1

Você tem <body class="off-canvas hide-extras"> já?

este código: <script> document.write("<script src=/" + ("__proto__" in {} ? "zepto" : "jquery") + ".js></script>"); </script> Carrega o Zepto (biblioteca compatível com jquery). Quando o zepto não é suportado (IE), ele carrega jquery. Apenas como uma etapa de solução de problemas, eu tentaria remover <script> document.write("<script src=/" + ("__proto__" in {} ? "zepto" : "jquery") + ".js></script>"); </script> e {{ "zepto.js" | asset_url | script_tag }} e importar jquery talvez com {{ "jquery.js" | asset_url | script_tag }}

Eu só dei uma olhada no offcanvas.js. Não é tão estranho, pois chama alguns métodos não disponíveis no zepto.Ele chama scrollTop, por exemplo.Use jQuery e ele vai funcionar bem.


Perguntas relacionadas


Comentários (0)

Adicione um comentário