After selecting the filter tabs, they work perfectly fine but always scroll the page to the top. Can someone please take a look at the code below and point out what mistake I've made in it?
On the other hand, the Back-to-Top function is working as intended.
I aim for these two functions to operate independently as one filters images while the other scrolls the page back to the top.
<script>
$(document).ready(function(){
$(".button").click(function(){
var name = $(this).attr("data-filter");
if(name == "All"){
$(".filter").show("2000");
}
else{
$(".filter").not("."+name).hide("2000");
$(".filter").filter("."+name).show("2000");
}
});
$(".navigation a").click(function(){
$(this).addClass("active").siblings().removeClass("active");
});
});
</script>
<script>
$(window).scroll(function(){
var height = $(window).scrollTop();
if(height > 100){
$("#Back2Top").fadeIn();
}
else{
$("#Back2Top").fadeOut();
}
});
$(document).ready(function(){
$("#Back2Top").click(function(event){
event.preventDefault();
$("html, body").animate({scrollTop:0}, "slow");
return false;
});
});
</script>
Both functionalities should run separately from each other