CODEWITHSUNDEEP
jqueryhtml
Mark C.
Mark C.

Reputation: 6450

Exclude elements from function

Whenever I click a tab, the window scrolls down after the click, because of the below code. How can I keep the smooth-scroll code, while excluding the below html (or using the jQuery selector in the function)?

I have this code :

//smooth-scrolling
$(function() {
    $('ul.nav a, .smooth').bind('click',function(event){
        var $anchor = $(this);

        // $("li[role='presentation'] > a") <- Remove this from the scrollTop fn
        $('html, body').stop().animate({
            scrollTop: $($anchor.attr('href')).offset().top
        }, 1500,'easeInOutExpo');

        event.preventDefault();

    });
});

I'm not sure how to check if this is the element passed in, because the .bind() event is attached to what I am clicking :

<ul class="nav nav-tabs" role="tablist">
    <li role="presentation" class="active"><a href="#focus" aria-controls="focus" role="tab" data-toggle="tab">Test Tab</a></li>
</ul>

I know of the :not() selector, but I am not sure how to use it in this scenario (or where to put it, if it's the correct route). I could use something like :not("role=tablist")" perhaps(?), but I am not sure where to put it.

I tried using an if statement on the selected element, but didn't seem to capture it correctly. I added a function that returned undefined before scrollTop hit - but that removed the functionality entirely (as it should have).

Upvotes: 0

Views: 63

Answers (1)

adeneo
adeneo

Reputation: 318182

You can use .not with the attributes selector to exclude the element

$('ul.nav a, .smooth').not('[role="tab"]').on('click', function() {. ..

Upvotes: 1

Related Questions