tinyScrollbar mousewheel on horizontal scroll only works for chrome - mousewheel

I´m using tinyScrollbar for an horizontal scroll, but the mousewheel only works in chrome.
In Firefox (29.0.1) and in Internet Explorer (11), the mouse wheel is not working. I{m using windows 8.
You can check it out in the official web of the plugin (http://baijs.nl/tinyscrollbar/), in the horizontal scroll example with images.
Anybody else have this problem?

Related

Missing vertical scrollbar in web browser for vaadin 6.8.12

I have recently built a new Vaadin widgetset for our web application. The new widgetset is based on some new addons but especially on vaadin 6.8.12.
When I deploy the ear file and start the application the right vertical scrollbar that belongs to the web browser (not a java panel or layout) is missing. The scrollbar is actually there but you are forced to drag the browser window far to the right in order to make it visible. Even though it is visible you can not scroll down as much as you need to view the lower content of the page.
This is a problem in Chrome, Firefox and Opera but for some reason Interner explorer seems to handle it just fine.
So what I want is that the browser scrollbar should be visible regardless of the size of the window.
Any ideas?
The height of a layout must be undefined for the vertical scrollbar to show up. If you set it to 100%, any content off the bottom of your browser window / tab will be hidden.
If that's not enough, please add some code to see how you made your main window layout.

HighCharts Label horizontally instead of vertically on IE10 compatibility

In Internet Explorer 10, if you set the page to be IE8 documents mode does y-axis label appears horizontally instead of vertically?
We have controls what require us to use the IE8 mode on the page.
I've managed to get it to happen on my site and the HighCharts website too.
Is there a workaround for this?
Thanks

How to make a JQueryMobile-based application have a "touch" behavior in a desktop browser

I am using JQueryMobile to build an application that will mainly run on a Linux-based touch device with Firefox.
My issue is that, with JQM, when page contents cannot fit on the screen, the web browser displays a vertical scrollbar displays a vertical scrollbar
There is no such issue with Sencha and Dojo. They both behave like if they were running on a touch-based device, even with desktop web browser (reduce the height of your browser window) :
Sencha scrolling list
Dojo scrolling list
So, how can I make JQM to be touch-friendly when running on a desktop web browser ?
It seems that there is no really good JS and/or CSS solution for this issue.
Hiding the scrollbars with CSS (overflow-y: hidden;) prevents scrolling and mess JQM touch events.
I found a workaround by using a Firefox plugin (Grab and Drag), which is an acceptable solution since I control the device that runs the browser.
It works fine, but it is not a pure JS/HTML/CSS solution...

jqueryui sortable issue with Chrome and Firefox

I created a horizontally scrollable container with sorting.
There are some requirements:
The bounding box is fixed width
Must scroll when overflowing, no wrapping
Here is the JSFiddle: http://jsfiddle.net/6vXG2/ (drag columns with pink header)
This works perfectly with: IE9, Opera, Safari
But not working with: Chrome, Firefox
In both Chrome and Firefox, the elements start jumping around. (Incidentally, the behavior on Firefox is different between Windows and OSX, using exactly the same version - 17.0.1)
When initially designing it using float:left, all browsers behaved correctly, but due to no wrapping requirement, I cannot use this.
Any ideas how to fix this? Or is this a jqueryui bug/issue?
Thanks
EDIT:
If I add border-collapse: collapse it behaves correctly again in Chrome, but breaks in Opera.
EDIT 2:
Found a 'weak' workaround going back to float:left: See http://jsfiddle.net/6vXG2/1/. Not ideal, but OK for now. Still open for suggestions.

How to enable iframe scrollbar on iOS safari

I am trying to implement facebook's live stream plugin on my website. I see that there is a scrollbar on pc and mac browsers, but not on iphone or ipad safari. I think it is because iphone and ipad treat scrollbar differently since they are both touch based devices. So I expect to scroll iframe with two fingers, but it does not work either.
Here is sample page (used a different src url) http://para.qacode.com/test.php
How do I enable two finger scrolling or normal scrollbar on ios safari?
On iOS versions prior to 5, you can scroll iframes on iPad/iPhone using two fingers, but this is a bit of a hidden feature and most people don't know about it. I'm not sure why tow-finger scrolling isn't working for your iframe - perhaps there is some JavaScript intercepting the touch event?
On iOS 5 this has been fixed and scrolling works as expected for iframes with one finger.
If you need to scroll a sub-region of the page on iOS 4 and earlier, the best bet is to use a library such as iScroll that implements scrolling with JavaScript touch-event handling.
Apply these styles to the parent container:
-webkit-overflow-scrolling:touch;
overflow:auto;

Resources