Menu has “scroll to #href” function, BUT unable to use _target blank links there

Question

My problem is that my navbar has scroll to link function, because my site is in one page.

But I tried to add a new link to menu, with an external link (not in the same page).

When I click it, it won't open the link (I assume jQuery script tries to scroll to it instead of opening...)

How should I fix it or add exception?

This is the html:

<ul class="menyy">
                    <li><a href="#info">Mis on Rahapuu?</a></li>
                    <li><a href="#kkk">KKK</a></li>
                    <li><a href="#meist">Kes me oleme?</a></li>
                    <li><a href="http://rahapuu.eu/laenud/" target="_blank">Laenud</a></li>
                    <li><a href="#kontakt">Kontakt</a></li>
                </ul>  

And this is the jQuery script for smooth scrolling:

//smooth scroll to href value
            jQuery(".tabs-btn ul li a, .navbar-nav li a, .navbar-brand, .menyy a").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 to destination
                 jQuery('html,body').animate({scrollTop:dest}, 1000,'swing');
             });

Any advice?

Answer 1

您可以对其进行过滤，使其仅包含具有基于散列的链接的锚点

jQuery(".tabs-btn ul li a, .navbar-nav li a, .navbar-brand, .menyy a").filter('[href^=#]').click(function(event){ ...

Answer 2

Since someone else threw out adding a class (which is by far the best way to do this, however I recommend just applying that class across the board and simplifying the selector), I figured I would provide an alternative that was universal and didn't require modding the HTML (in case you couldn't for some reason):

$(".tabs-btn ul li a, .navbar-nav li a, .navbar-brand, .menyy a").filter(function(){
    return (!this.target || this.target !== '_blank');
}).click(function(e){
    e.preventDefault();

    //calculate destination place
    var dest = 0,
        htDiff = $(document).height() - $(window).height(),
        hashOffset = $(this.hash).offset().top;

    if(hashOffset > htDiff){
        dest = htDiff;
    } else {
        dest = hashOffset;
    }

    //go to destination
    $('html,body').animate({scrollTop:dest}, 1000,'swing');
});

This will only filter your original collection of objects down to items that either do not have a target listed, or do not have a target with a value of _blank . I also took the liberty of caching your calculations, since you use them multiple times.

Answer 3

You can give all the others a class name and leave the link one out

    <ul class="menyy">
        <li><a class="yourclass" href="#info">Mis on Rahapuu?</a></li>
        <li><a class="yourclass" href="#kkk">KKK</a></li>
        <li><a class="yourclass" href="#meist">Kes me oleme?</a></li>
        <li><a href="http://rahapuu.eu/laenud/" target="_blank">Laenud</a></li>
        <li><a class="yourclass" href="#kontakt">Kontakt</a></li>
    </ul>

And change to this:

jQuery(".tabs-btn ul li a, .navbar-nav li a, .navbar-brand, .menyy a .yourclass").click(function(event){