my dropdown menu bootstraps work internal links. want work external links
www.speleobox.be/test
this code:
<!-- begin navigation --> <ul class="nav navbar-nav"> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">huur uw... <span class="caret"></span></a> <ul class="dropdown-menu" role="menu"> <li><a href="http://www.speleobox.be">speleobox</a></li> <li><a href="http://www.sumopak.be">sumopakken</a></li> </ul> </li> <li><a href="#experience">speleobox</a></li> <li><a href="#pricing-tables">prijzen</a></li> <li><a href="#contact-us">contact</a></li> </ul> <!-- end navigation -->
as see have custom code scrolls anchor in code. prevents default onclick events external links.
//smooth scroll href value jquery(".tabs-btn ul li a, .navbar-nav li a, .navbar-brand").click(function(event){ event.preventdefault(); //calculate destination place var dest=0; if($(this.hash).offset().top > $(document).height()-$(window).height()){ dest=$(document).height()-$(window).height(); }else{ dest=$(this.hash).offset().top; } //go destination jquery('html,body').animate({scrolltop:dest}, 1000,'swing'); });
also there error in code can see in dev console
cannot read property 'top' of undefined
i suggest removing code , swap 1 https://css-tricks.com/snippets/jquery/smooth-scrolling/
jquery(function() { jquery('a[href*=#]:not([href=#])').click(function() { if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) { var target = jquery(this.hash); target = target.length ? target : jquery('[name=' + this.hash.slice(1) +']'); if (target.length) { jquery('html,body').animate({ scrolltop: target.offset().top }, 1000); return false; } } }); });
this functions works great, i've used bunch of times.