Hej, może ktoś z Was będzie wiedział jak rozwiązać ten problem. Mam stworzoną stronkę responsywną i cały problem polega na tym, że kiedy jestem na stronie głównej, a kod wygląda jak niżej to wszystko działa, ale nie do końca tak jakbym tego chciała tzn. klikając na przycisk "kontakt" przenosi mnie do kontaktu na dole strony, ale nie jest to przejście scrollowania strony, a zwyczajnie przeskakuje przez zniknięcie i pojawienie się.
<!-- Scroll Top Button -->
<a href="#home" class="smoothscroll">
<div class="scroll-top"><i class="fa fa-angle-up"></i></div>
</a>
<!-- End Scroll Top Button -->
<!-- Nav Section -->
<header>
<!-- Nav Section -->
<nav class="navbar navbar-default navbar-fixed-top nav-area" id="scroll-menu">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" >
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="index.html"><img src="img/logo.png" alt="responsive img"></a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="dropdown active">
<a href="index.html#home">Home</a>
</li>
<li class="dropdown mega-dropdown">
<a href="index.html#firma">O firmie</a>
</li>
<li class="dropdown">
<a href="index.html#oswietlenie" class="dropdown-toggle" >Oświetlenie dla roślin</a>
<ul class="dropdown-menu">
<li><a href="grow-led-28.html">Mała żarówka grow led 28 chipów full spectrum</a></li>
<li><a href="grow-led-36.html">Żarówka grow led 36 chipów full spectrum</a></li>
<li><a href="grow-led-150.html">Żarówka grow led 150 chipów full spectrum</a></li>
<li><a href="grow-led-rozkladana.html">Rozkładana żarówka grow led 3500K</a></li>
<li><a href="mala-grow-led-dioda-cob.html">Mała żarówka grow led z diodą COB 3500K</a></li>
<li><a href="duza-grow-led-dioda-cob.html">Duża żarówka grow led z diodą COB 3500K</a></li>
</ul>
</li>
<li class="dropdown">
<a href="index.html#warunki">Warunki eksploatacji</a>
</li>
<li><a href="index.html#kontakt">Kontakt</a></li>
</ul>
</div>
</form>
</div>
</div>
<!--/.nav-collapse -->
</div>
</nav>
</header>
<!-- End Nav Section -->
Domyślam się, że powinnam gdzieś dodać klasę "smoothscroll", ale jak wrzucam ją tak jak niżej:
<li class="dropdown mega-dropdown">
<a href="index.html#firma" class="dropdown-toggle smoothscroll" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">O firmie</a>
</li>
To już nawet nie przenosi w taki sposób jaki opisałam wyżej. Przyciski robią się nieaktywne.
Dodatkowym problemem jest też to, że w wersji mobilnej pojawia się menu tak jak powinno pod względem wizualnym, ale przyciski kompletnie nie działają...
Czy ktoś z Was wie może, gdzie robię błąd i mógłby mnie jakoś naprowadzić? :)