Expandable way to make elements stick after a certain point using jQuery

How can i make elements stick after a certain point in jQuery but i can do it with multiple different elements at multiple different lengths from top?

Every function i see only works for one item, and i have no idea how to expand upon it since i can find little explanation on why the code works.

Can this function not be hard coded for one element, and instead take in the element (id) as a parameter and find its position?

Hopefully i am making sense.

Did you ask this same question a little while ago on StackOverflow? I saw it over there, and didn’t really understand that one.

What do you mean by “stick”?

And if you have a function that does what you want for a single item, what’s to keep you from simply calling that function within a loop (for example, using jQuery, if you have an array of elements to add, you could do:

let myExistingEl = $("#myExistingEl");
arrayOfElementsToAdd.each(function(element, index){
  // This would be where you could use your custom function, on every element
  $(element).insertAfter(myExistingEl);
}) 

That would take however many elements you have in the arrayOfElementsToAdd, and insert them after the given el. Of course, given the way I wrote that, they’ll insert in reverse order…

To stick means it sticks to the top of the page and goes down with the user. Not to be confused with a a nav bar, when you scroll past the element on the html it sticks to the top f the page.

Exmaple code -->https://stackoverflow.com/a/26664059/10448256

I would like the basis of that code in a function that takes the element ID as a parameter so i can call it with multiple items. I would also like to know why is works.

Yes that was me, but i did a poor job explaining myself. Wow what a coincidence.

Are you looking to have the elements cascade, so you can stick them in a column or something? I’d simply stick a column div, then append the elements into that. Give the container a fixed position, and the ones you want to stick in there relative positioning.

I’m just trying to figure out how to stick elements to the top of the screen when i scroll past them on the html. Their is already code to do that.

I am looking for how i can do that same thing, but instead he function behind it takes the elements id as a parameter, and make it stick to the top of the screen when i scroll past it.

I don’t want to copy and paste the same function twice for two different items, i instead want a general function that i can just call.