I don't know how to exit (this).scrollTop()

Asked 2 years ago, Updated 2 years ago, 149 views

I usually use simple jQuery, but I always stumble when it gets complicated.
Please tell me how to make it possible to achieve the following actions.

"I was able to do the 3rd above, ""While the image is following up, if you click on the image, remove the added class,"" but I cannot do the last (I want to finish following up)."
Monitoring to detect scrolling is not finished and a follow-up class is added immediately.

(this).scrollTop() can't end because I can't do what I want to do.
After clicking, I don't know how to include (this).scrollTop() termination at the end of follow-up.

Source Codes Affected

html

<body>
<div>
 <p class="imgBox"><a href="#"class="imgBtn"><img src="alt="">a>>p>;;
</div>
<body>

css

.imgBtn{
  width —300px;
  height —50px;
}

.imgBox.is_follow{
  position:fixed;
  bottom:0;
  width —300px;
}

JavaScript

// Follow when it reaches 160 or higher, and follow when it reaches 160 or lower.
    $(window).on("scroll", function(){
        if($(this).scrollTop()>160){
            $(".imgBtn").addClass("is_follow");
        } else{
            $(".imgBtn").removeClass("is_follow");
        }
    });

// Click to finish following
    $(".imgBtn").click(function(){
        $(".imgBtn").removeClass("is_follow");
    });

javascript html jquery scss

2022-09-29 22:35

1 Answers


I want to end the follow-up process
If you want to stop monitoring follow-up, and you want to stop monitoring scroll events, you can use .off()|jQuery.

 // Click to remove follow-up & scroll event
$(".imgBtn").click(function(){
    $(".imgBtn").removeClass("is_follow");
    $(window).off("scroll");
});


2022-09-29 22:35

If you have any answers or tips


© 2024 OneMinuteCode. All rights reserved.