This is loosely based on Chris Coyier's snippet: https://css-tricks.com/long-dropdowns-solution/
I'm working on a long-dropdown solution, and I would like to eliminate the extra space at the bottom, and perhaps make it a little easier to click items close to mouse. Hover over the menu to scroll it.
Here's the Fiddle: https://jsfiddle.net/3hanq4wt/1/
The extra space is caused by my JS moving the UL upwards. It will need an improved movement ratio so that so that the UL doesn't move quite so high when scrolling.
I tried several things, such as:
var remainder = containerBottom - ( list.offset().top + listheight );
//this remainder ought to be useful somehow. Surely it must.
I do realize that this is not an ideal UX solution for most cases, but I have a layout that requires fixed height (assigned dynamically) container with overflow hidden.
Thanks :)
I was able to get rid of the extra space in your fiddle by adding some pixels to your offset.
containerTop = container.offset().top + 50,
or using your listheight variable
listheight = list.outerHeight() - 200,
Since this took me quite a while, I'll post solution:
multiplier= ( listheight-container.outerHeight() ) / container.outerHeight();
Change the multiplier so it uses the actual distance you want to move, divided by the number of cursor pixels in the 'track'.
Fiddle: https://jsfiddle.net/3hanq4wt/3/
Firebase Cloud Functions: PubSub, "res.on is not a function"
TypeError: Cannot read properties of undefined (reading 'createMessageComponentCollector')
I use table sorter. According the table content different pages(pagination) can have different width.
I am using below code to load some content in iFrame. .
I'm using http://autocompletejs. com/ and my client is asking if certain words can be excluded, or as they say, "treated as neutral", and not trigger the autocomplete box from displaying.