SVG Blocks Touch/Mousewheel Events

Is there a workaround? I am running my own custom scrollbar script as opposed to using the built in browsers functionality. I prefer to use SVG for my image elements for a number o

Solution 1:

Per Duopixel's comment. Adding:

object {
    pointer-events: none;
}

To the css does solve the problem in both Firefox and Chrome. I still have to test in IE, but for now this seems the best and easiest solution.

A good article that explains the pointer events attribute can be found at http://davidwalsh.name/pointer-events

If the issues mentioned above are an issue in IE, you can use a javascript solution that requires capturing the position of the pointer and passing it to the proper element. A working version that uses jQuery but could very easily be translated into vanilla javascript can be found here: http://jsbin.com/uhuto/1/edit