I am currently working with Materialize CSS (link) and I'm trying to figure out how to move select content while scrolling the page or when the window is scrolling. However, the example code I've implemented doesn't seem to be working. Is there any way to achieve this?
You can find the code I'm using here: http://jsfiddle.net/uj6p7o3a/
$(document).ready(function(){
$('select').formSelect();
});
$(document).on('click','.select-wrapper .select-dropdown.dropdown-trigger',function(){
var this_c = this.getAttribute('data-target');
var lastScrollTop = 0;
var count_scroll = 1;
$(window).scroll(function (event) {
var pos_s_c = parseInt($('#'+this_c).css("top").replace('px',''));
var pos_s = $('select').position();
var st = $(this).scrollTop();
if (st > lastScrollTop){
count_scroll++;
st++;
} else if (st < lastScrollTop){
count_scroll--;
st--;
}
lastScrollTop = st;
var scroll_data = count_scroll;
$('.select-wrapper .dropdown-content.select-dropdown').css({'argin-top':(lastScrollTop-st-scroll_data)-pos_s.top+pos_s_c+'px'});
});
});