Question

<A><ABC>Hi</ABC></A>

我尝试使用$('.mainNav a[href^="#"]').on('click', function (event) { var target = $(this.getAttribute('href')); if (target.length) { event.preventDefault(); $('body').stop(true).animate({ scrollTop: target.offset().top - 130 }, 1000); } return false; });但仍然闪烁

Answer 1

这是我要做的：
- 因为您使用preventDefault()而不需要返回false，所以您应该将其放在任何条件声明之前 - 您不需要true功能中的stop() - 您应该使用$('html, body')代替$('body')

$('.mainNav a[href^="#"]').on('click', function (event) {
   var target = $($(this).attr('href'));
   event.preventDefault();
   if (target.length){
       $('html, body').stop().animate({
           scrollTop: target.offset().top - 130
       }, 1000);
   }
});

但是，如果它没有解决你的问题，也许可以使用jsfiddle或codepen来向我们展示？因为闪烁可能是由于脚本本身以外的其他因素造成的。

Answer 2

HMM。别在这里看到你的问题。除了JQ代码的一些小问题

举了一个简单的例子。请参阅此处 jsfiddle

或下面的代码段：

＆＃13;

# Ask how long the file is
with open("file.txt", "r+b") as text_file:
    lines = text_file.readlines() # returns a list of the lines in the file
num_lines = len(lines)

# Now use two for loops to iterate
for line in range(num_lines):
    new_filename = "file_"+str(line)+".txt"
    new_file = open(new_filename, "w")
    for item in lines[line:]:
        new_file.write("%s\n" % item)
    new_file.close()

＆＃13;

$('.mainNav a[href^="#"]').on('click', function (event) {
   event.preventDefault();
   var target = $(this.getAttribute('href'));
   if (target.length) {
   $('html,body').stop().animate({
       scrollTop: target.offset().top - 130
     }, 1000);
   }

});

＆＃13;

h1 { 
  color:#fff;
  font-size:30px;
  margin:0
}
#home {
  height:300px;
  background:red;
  margin-top:48px;
}
#about {
  height:600px;
  background:green
}
#contact {
  height:200px;
  background:blue;
}
ul li { 
  list-style:none;
  display:inline-block
}
ul { 
   position:fixed;
   padding:15px 0;
   width:100%;
   background:rgba(255,255,255,0.6);
   top:0;
   margin:0
}

＆＃13;

使用动画时滚动并滚动到

2 个答案: