CODEWITHSUNDEEP
javascriptjqueryhtmlcss
user2845764
user2845764

Reputation: 13

How to fix page scrolling

i'm try to control page jump when i'm click on the tab id, my demo link http://jsfiddle.net/bala2024/x9ypj/

function showSection( sectionID ) {
    $('div.section').css( 'display', 'none' );
    $('div'+sectionID).css( 'display', 'block' );
}
$(document).ready(function(){
    if (
        $('ul#verticalNav li a').length &&
        $('div.section').length
    ) {
        $('div.section').css( 'display', 'none' );
        $('ul#verticalNav li a').each(function() {
            $(this).click(function() {
                showSection( $(this).attr('href') );
            });
        });
        $('ul#verticalNav li:first-child a').click();
    }
});

Upvotes: 0

Views: 89

Answers (3)

Jake Hills
Jake Hills

Reputation: 448

The best way is to use this:

$('#verticalNav a').click(function(e){
    e.preventDefault();
});

Upvotes: 1

Javier Rico
Javier Rico

Reputation: 81

First off, you can replace 

.css( 'display', 'block' );

with just

.show();

And, 

.css( 'display', 'none' );

with

.hide();

Finally, in order to prevent link behavior, you need to change this block.-

$('ul#verticalNav li a').each(function() {
    $(this).click(function() {
        showSection( $(this).attr('href') );
    });
});

for this.-

$('ul#verticalNav li a')
    .click(function(e) {
        showSection( $(this).attr('href') );
        e.preventDefault();
    });

Upvotes: 1

Abhidev
Abhidev

Reputation: 7253

prevent the default behavior of the anchor tags. check out the updated fiddle

$('#verticalNav a').click(function(){
    return false;
});

http://jsfiddle.net/x9ypj/1/

Upvotes: 1

Related Questions