sadmansh
sadmansh

Reputation: 927

How to set a min/max value for variable increasing/decreasing with scrollTop?

I have a variable called yPos increasing and decreasing based on the value of $(window).scrollTop() on scroll. I would like to set a maximum and minimum value so that the yPos variable cannot be any lower than the min value and cannot be bigger than the max value, but still change depending on scrollTop. How should I go about doing this?

Upvotes: 1

Views: 1248

Answers (3)

Sajad Karuthedath
Sajad Karuthedath

Reputation: 15787

Use something like this.

var yPos= 0;
var min_value = 10;
var max_value = 100;
if($(window).scrollTop() >= min_value && $(window).scrollTop()<= max_value)
{
  yPos = $(window).scrollTop();
}

note: this just a logic, please don't copy paste this to your code.

Upvotes: 1

Ahmed Ali
Ahmed Ali

Reputation: 1966

$(document).ready(function(){
  var scroll = 0;; 
  var maxvalue = 100;
  var minvalue = 10;
  var temp = 0;
  $(document).scroll(function(){  
    temp = $(window).scrollTop();
    if(temp > maxvalue)
    {
     temp = maxvalue;      
    }
    if(temp < minvalue){
      temp = minvalue;
    }
    scroll = temp;
   
        
     
    console.log(scroll);
  });
});
body{
  height:200vh;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Upvotes: 1

Addis
Addis

Reputation: 2530

const max = yourMax;
const min = yourMin;

let yPos = $(window).scrollTop();

if(yPos > max) {
  yPos = max;
}
else if(yPos < min) {
  yPos = min;
}

Upvotes: 3

Related Questions