I have a horizontal scrolling site that uses jquery to reverse the mouse axis on the scroll wheel on the mouse. This works fine on every browser apart from safari. The address of the page with the scrolling is here: http://www.jamesbells.com/index.php?page=alias
Can anyone help - all I need is for the mouse wheel to scroll left and right when moved up and down.
Cheers
Jon
This could be another way to go with more customizations available.
Related
Im trying disable the swipe functionality when the slider is zoomed, to make sure when the user drags the image to zoom, they are not going to trigger the swipe to the next or prev slide.
I tried to use allowTouchMove, but this only works on chrome, not on safari, firefox or edge.
Disabling prev and next slides on zoom works, with allowSlidePrev, allowSlideNext however when I click on the gallerys thumbnails it also disables clicks on there. Is there another way of disabling the swipe events, but allowing drag, and the gallery events being clickable?
I also tried this before, and found no clues in the docs.
Notice that it's in fact really hard to swipe to other slide when the zoom is enabled (at least in the v6.0.4). So only if the attempt is long and strong enough, the swiper will swipe.
So... I think that this is the desired behavior of the maintainers.
I'm having a problem scrolling in all the JetBrains IDEs (PyCharm, PhpStorm) using touch screen. I have a Dell XPS 15 with a touchscreen.
When I try to scroll it just selects code. I have tried in regular Notepad and Notepad++ and there works as expected.
Has anyone else experienced it? Is there any solution to this? It would be really great to scroll through the code using touchscreen.
I have found temporary solution by installing plugin Code glance (https://plugins.jetbrains.com/plugin/7275). The plugin provides a sidebar with code map, which is similar to the one from Sublime. In the sidebar it is possible to navigate through code. It is not ideal but it's better than nothing.
Yes, I was having the same problem. And luckily I got a gesture to scroll using two fingers:
Scroll up: Tap and hold using one finger and swipe away[from close to distant of the first finger] using another finger. Swiping away from each other also works.
Scroll Down: Tap and hold using one finger and swipe in[from distant to close of the first finger] using another finger. Swiping close to each other also works.
I am creating a site in pure Famo.us, I wanted to have 1 page with sections where the user has possibility either click on links and scroll to anchors or scroll sequentially to get to sections. I used initially famo.us scrollview, but its behavior was not was not similar to browser scroll - I tried many options. I implemented my own scroll with Scrollsync, modifier and transition but it still does not feel similar to browser scroll. But the main problem that on Laptop and Desktop PC - I need to set different scrollscale to function normally. Here is the app:
https://svet15.herokuapp.com/
Can anybody give a direction to solve the problem with syncscale and maybe how to make scroll similar to browser native scroll.
P.S. I keep mobile view separately from desktop, so window.width should be more than 500 to see the desktop view where I have this problem. Thank you in advance!
I'm having some issues with a website that only occur in Safari. I'm running version 5.1.7 (7534.57.2) on a Mac.
You can view the site here: http://mcad.edu/annual-report-2011-12/.
The website is parallax scrolling, with a relative positioned content div that holds everything, including the 3 parallax scrolling backgrounds which are all fixed, top and left set to 0.
Within the fixed parallax background containers, colorized images fade into full color images when a user mouses over them. For each "image", there are two divs stacked, each with background images that are positioned by background-position. The div on the bottom has the colorized image. The div on top has the full color image as a background and has its opacity set to 0 until mouseover. The fade is achieved using a CSS transition on the opacity property so that the top div becomes visible.
So, in Safari only, when I mouse over any of these divs, the transition occurs smoothly but all of the content in the same parallax scrolling background div shifts/jumps in the process. If I remove the CSS transition, this does not occur.
I think that it might have something to do with the transition/webkit-transition property not playing nicely with a fixed position container in Safari. However, all of the issues I've found that relate to that are from 2010 and mention a Safari bug that I assume has been fixed…two years later. But maybe not.
There's also another issue with the Catalyst section (3rd dot down on the right navigation). These animated images work as links in Chrome, Firefox and Opera, but not Safari. Any ideas?
I have a similar issue with a fixed position and transition-duration for a header menu I've created. When a visitor scrolls down, the menu has a box shadow that fades into place. Well when this is viewed on safari in a MacOS, I get a weird sliding in issue. To easily fix this, after spending way to much time searching for answers, I'm removing the transition effect for macs. This fixes the slide in issue but gets rid of the transition effect sadly.
So as you were speculating, it probably is the transition duration on your project as well. The best thing for this would probably be to make a Mac-Safari CSS file, get rid of the transition-duration for that particular area and move on with your project.
Best I can suggest for now. Hope it helps.
I have an app that has a list of tags on the bottom of the window. This list grows over time and needs to be scrolled horizontally. This was fine before, but now in Lion they scrollbars automatically hide. If using a mouse without a horizontal scroll, there's basically no way to scroll these now in Lion. What are the best practices here to solve the issue? Do I need to get rid of the scrollview and change it to a "More" list or something?
If the user doesn't have a device available which supports touch-based scrolling (e.g, a touchpad, Magic Trackpad, or Magic Mouse), the horizontal scrollbar won't be hidden by default. It's controlled by this preference option: