I'd like to create a div that is able to scroll but does not display scrollbars. I have found a solution for Webkit (below) but how can this be done in other browsers?

I'd prefer to avoid using a javascript plugin. Hoping to find a CSS or vendor specific solution.

Webkit Solution

#photoreel::-webkit-scrollbar {
    height: 0;
    width: 0;
}
#photoreel {
    overflow-x: scroll;
    overflow-y: hidden;
}

You must wrap your scrollable div in another div with overflow:hidden that hides the scrollbar.

See http://jsfiddle.net/qqPcb/ for an example.

BTW: The same technique is used by a nice little jQuery plugin called jScrollPane

2019 solution

Since Firefox 64 there is a perfectly simple solution for this (working only in Firefox and Firefox mobile)

scrollbar-width: none;

Check the docs

For the comers from the post marked as duplicate, there is also MS Edge solution:

-ms-overflow-style: -ms-autohiding-scrollbar;

For (pre-Chromium) Edge:
-ms-overflow-style: none;

For Firefox:
scrollbar-width: none;