CODEWITHSUNDEEP
javascriptjqueryhtmlcssscroll
h2c
h2c

Reputation: 235

Smooth scroll script issue

I'm using a smooth scroll script for a site I'm currently working on, and I've got a really annoying problem what I've experienced before with the same script. It works nice and smoothly but when I click on one of the navigation points what should lead me to the div(or a) I'm trying to target, it shows me the targeting area for like 0.1 seconds, and then it starts to scroll. It doesn't happen everytime, but often enough to be annoying. How could I prevent this? Here is the script I'm talking about: 

$(window).load(function(){
                $(".contactLink").click(function(){
                    if ($("#contactForm").is(":hidden")){
                        $("#contactForm").slideDown("slow");
                    }
                    else{
                        $("#contactForm").slideUp("slow");
                    }
                });
            });
            function closeForm(){
                $("#messageSent").show("slow");
                setTimeout('$("#messageSent").hide();$("#contactForm").slideUp("slow")', 2000);
           }

$(window).load(function() {
  function filterPath(string) {
    return string
      .replace(/^\//,'')
      .replace(/(index|default).[a-zA-Z]{3,4}$/,'')
      .replace(/\/$/,'');
  }
  $('a[href*=#]').each(function() {
    if ( filterPath(location.pathname) == filterPath(this.pathname)
    && location.hostname == this.hostname
    && this.hash.replace(/#/,'') ) {
      var $targetId = $(this.hash), $targetAnchor = $('[name=' + this.hash.slice(1) +']');
      var $target = $targetId.length ? $targetId : $targetAnchor.length ? $targetAnchor : true;
       if ($target) {
         var targetOffset = $target.offset().top - 110;
         $(this).click(function() {
           $('html, body').animate({scrollTop: targetOffset}, 1400);
           var d = document.createElement("div");
        d.style.height = "101%";
        d.style.overflow = "hidden";
        document.body.appendChild(d);
        window.scrollTo(0,scrollToM);
        setTimeout(function() {
        d.parentNode.removeChild(d);
            }, 10);
           return false;
         });
      }
    }
  });
});

Upvotes: 1

Views: 219

Answers (2)

h2c
h2c

Reputation: 235

Found the solution:

 $(this).click(function(e) {
               e.preventDefault();

Now it rolls fine.

Upvotes: 1

mikakun
mikakun

Reputation: 2275

setTimeout(function() {
    d.parentNode.removeChild(d);
        }, 10);
       return false;
     });

move the return false out of the setTimeOut

Upvotes: 1

Related Questions