向下滚动页面时,网页卡在jquery滑块上

时间:2015-09-30 21:04:17

标签: javascript jquery html css

我在长主页的中间有一个滑块。我用我的鼠标滚轮和触控板向下移动页面,当它到达此部分时,滚动停止并开始滚动滑块。如何删除此div的鼠标滚轮/触控板功能,以便我可以轻松地向下滚动页面?

滑块如下所示:

<div class="content_slider_wrapper" id="slider1"></div>

$(document).ready(function() {



                   var image_array = new Array();
                   image_array = [
                   {image: ‘myimage.jpg',
                   main_link: '', main_link_target: 0,
                   upper_text_label_show: 0, upper_text_label: '', upper_text_label_style: '',
                   lower_text_label_show: 1, lower_text_label: ‘My Item’, lower_text_label_style: 'color: black; font-family: Arial;'},

                   ];
                   $('#slider1').content_slider({   // bind plugin to div id="slider1"
                                                map : image_array,      // pointer to the image map
                                                middle_click: 3,
                                                max_shown_items: 7,     // number of visible circles
                                                hv_switch: 0,           // 0 = horizontal slider, 1 = vertical
                                                active_item: 1,         // layer that will be shown at start, 0=first, 1=second...
                                                wrapper_text_max_height: 110,   // height of widget, displayed in pixels
                                                small_pic_height: 160,
                                                small_pic_width: 160,
                                                child_div_width: 180,
                                                child_div_height: 180,
                                                big_pic_width: 462,
                                                big_pic_height: 462,
                                                hide_prettyPhoto: 1,
                                                hide_arrows: 1,
                                                middle_click: 3,        // when main circle is clicked:
                                                auto_play: 1,
                                                enable_scroll_with_touchmove_on_horizontal_version: 0,
                                                enable_scroll_with_touchmove_on_vertical_version: 0,
                                                // 1 = slider will go to the previous circle, 2 = to the next,
                                                // 3 = open 'main_link', 0 = nowhere (no response)
                                                border_radius: 5,       // -1 = circle, 0 and other = radius
                                                border_on_off: 0,
                                                mode: 2,
                                                });




                   });

我尝试了以下操作但它们无效:

$(window).unbind('scroll');

$('#slider1').bind('mousewheel DOMMouseScroll', function(e) {
                                  var scrollTo = null;

                                  if (e.type == 'mousewheel') {
                                  scrollTo = (e.originalEvent.wheelDelta * -1);
                                  }
                                  else if (e.type == 'DOMMouseScroll') {
                                  scrollTo = 40 * e.originalEvent.detail;
                                  }

                                  if (scrollTo) {
                                  e.preventDefault();
                                  $(this).scrollTop(scrollTo + $(this).scrollTop());
                                  }
                                  });

1 个答案:

答案 0 :(得分:3)

如何将滑块的 enable_mousewheel 属性设置为0?

从其文档:

  

1表示当鼠标指针位于滑块上方时,鼠标滚轮将滑动滑块。如果要禁用此功能,请将其设置为0.

content slider plugin documentation