140
rated 0 times
[
147]
[
7]
/ answers: 1 / hits: 24556
/ 6 Years ago, mon, january 29, 2018, 12:00:00
<head>
<meta charset=utf-8 />
{% load staticfiles %}
<link rel='stylesheet' href={% static 'homepage/css/bootstrap.min.css' %}>
<link rel='stylesheet' href={% static 'homepage/css/element.css' %}>
<link href=https://fonts.googleapis.com/css?family=Comfortaa rel=stylesheet>
<style type=text/css>
html,
body {
height:100%;
font-family: 'Comfortaa', cursive;
padding-top: 100px;
}
header {
font-family: 'Comfortaa', cursive;
}
</style>
</head>
<header>
<nav class=navbar navbar-expand-lg navbar-inverse fixed-top id=mainNav>
<div class=container-fluid>
<a class=navbar-brand logo href={% url 'index' %}><img class=logo img src={% static 'homepage/img/leaves.png' %}>NAME</a>
<div class=collapse navbar-collapse id=mainNav>
<ul class=navbar-nav ml-auto>
<li class=nav-item>
<a class=nav-link href={% url 'product_page' %}>ProductName`</a>
</li>
<li>
<p class=navbar-btn>
<a data-toggle=modal href=# data-target=#newsletterModal class=btn btn-default>Newsletter</a>
</p>
</li>
<li class=nav-item>
<a class=nav-link js-scroll-trigger href={% url 'store' %}>Store</a>
</li>
<li class=nav-item>
<a class=nav-link js-scroll-trigger href={% url 'login' %}>Log In</a>
</li>
</ul>
</div>
</div>
</nav>
<div class=modal fade id=newsletterModal tabindex=-1 role=dialog aria-labelledby=newsletterModal aria-hidden=true>
<div class=modal-dialog>
<div class=modal-content>
<div class=modal-header>
<button type=button class=close data-dismiss=modal> ×</button>
<h4>Sign Up For Our Newsletter!</h4>
</div>
</div>
</div>
<div>
</header>
{% block content %}
{% endblock %}
I am trying to launch a modal when the newsletter button is clicked in the navbar but the modal is not showing. I followed some other stack overflow posts and tried to put the modal div outside the navbar among other tricks but nothing seems to be working. Any suggestions?
Any other suggestions with my code would also be appreciated. Thanks!
More From » html
