Вопрос

So I'm using jquery nicescroll plugin, and love the fact that it supports touch devices with option:

touchbehavior:true,

I've enabled this feature because of touch devices and because i love scrolling whit click and drag with mouse.

But something else is bothering me. Div which is scrollable containst links and much text. Links are clickable but this touchbehavior disables text selection what really bother me. I wanna keep selecting text enabled.

Except from that, when this touchbehavior is enabled, you can not click on actual scrollbar anymore and drag it down, what is really confusing on default computer or laptop. Is it possible to have touchbehavior and clickable and draggable scrollbar at the same time?

What I'm talking about is available to test and edit on this link: http://jsfiddle.net/P8cPZ/

Code looks like this;

html:

<div class="outer">
<div class="inner">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut sit amet nisi non 
    felis fringilla dignissim non et diam. Fusce et molestie nibh, pulvinar 
     tincidunt felis. Aenean hendrerit non dolor in mollis. Sed vehicula felis 
    eget tempor bibendum. Praesent commodo pretium sodales. Integer sit amet 
    semper lacus. <a href="www.google.com" >Cras imperdiet lectus at 
    sapien tempus malesuada.</a>..........
</div>
</div>

script:

$(".outer").niceScroll({
    cursorwidth:"6px",
    cursorborder: "0px",
    bouncescroll: true,
    horizrailenabled: false,
    touchbehavior:true,
    grabcursorenabled: true,
});

Any help or advice is welcome.

Это было полезно?

Решение 2

Set touchbehavior to true and preventmultitouchscrolling to false. You will able to drag and trigger any links.

touchbehavior: true,
preventmultitouchscrolling: false, 

Другие советы

There is an option cursordragontouch. Set it to TRUE and your scroll bar will work as usual. I mean you can combine cursordragontouch and emulatetouch:

$( '#something' ).niceScroll
(
 {
  emulatetouch: true,
  cursordragontouch: true
 }
);

Touchbehavior is only if you want to emulate touch behavior on desktop. You should set it to false or remove it. (its default is false anyway) You don't need it on desktop. And touch support is build in automatically for touch devices.

This worked for me!

    zindex: 9999,
    emulatetouch: true,
    cursordragontouch: true,
    touchbehavior: true,
    preventmultitouchscrolling: false,
Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top