I am using this swipe script from iDangero but I have a small, everywhere it works perfect but only Chrome on windows is giving me a hard time. I already stated the issue at the owner of the script but he can't find a solution for the script at this point, maybe somebody here can help me.
Issue at GitHub:
https://github.com/nolimits4web/Swiper/issues/825
Script URL:
http://www.idangero.us/sliders/swiper/
URL:
http://testjevorm.nl/magazine
The Problem:
As soon as you go to the website you have the possibility to navigate to the next slide in two ways:
Click on the "UITGELICHT ARTIKEL"-block on the left.
Click on the arrow on the right
When you click on the block on the left it's not possible to scroll up and down on the next page (the scroll is somehow not working/disabled). The weird thing is that it "activates" when you click on the arrow in the menu right or hover over the social media icons on a page.
To show the issue I made a small video:
http://youtu.be/T8Bnz2fsvhU
(Yes, it's windows XP but the problem is also there in Windows Vista and Windows 7)
Part of the solution:
I found out that it has to do with the css I added myself:
body {width:100%; height:100%;}
html {width:100%; height:100%;}
When I remove this, the problem is solved but then all the pages have the same height as the longest page in the serie.
just tried what you told me to do on my Mac. It works fine on my Mac, but that's not what you said that didn't work, so I tried it on a Windows 8 Laptop.
Well... it works perfectly fine for me, with Chrome 35 on Windows 8. I assume that you either resolved the issue, or that there's something wrong with your Windows XP setup on mac.
Note: I highly doubt that there is a issue on your website, which will only "show up" in Windows 7 or below, as Windows has always been pretty much downwards compatible (and I'm sure they haven't changed anything about the scroll behavior).
Note 2: If you're still having the issue, it might be chrome on Windows XP. But as you want it to work on that as well (or your companies policy states so), then try this:
In your CSS, simply add overflow-x: scroll to your body.
Related
I have developed an app using HTML5 and CREATEJS. I am encountering some issues that I cannot find a solution, for weeks. I hope someone can help.
1)On Android Google Chrome there is a problem that appears when I simply click anywhere on the screen: the FPS drops and any animation that is playing freezes for the duration of my touch. The problem is only in Mobile Chrome browser, on Android. It does not exist in other mobile browsers, neither in iPhone, neither in Safari, Firefox, etc.
I created a simple apk using webview and it doesn't have the problem either. So for some reason, the problem is only in mobile android chrome.
The code is optimized at maximum. 2 months ago we used only 1 canvas, but now we use multiple canvases and we have less animations in each canvas running everytime. While in android firefox it works perfect, but in android chrome it freezes for a single click.
I tried to disable stagemousedown/up events, because they are being triggered when I simply click anywhere in the stage. This didn't fix the problem or it is possible that there are some hidden stagetouch events that I don't know how to disable.
2)On Android Google Chrome and iPhone6 Safari, when I click the SPIN button, the game starts the SPIN, but with a delay of at least 1.5 seconds, but there is no such delay added with intention inside the code. On PC any browser, Android/iOS Mobile Firefox, this works perfect, no delay. In iOS Safari iPhone8 again it works perfect.
I created a simple apk using webview and it doesn't have this problem either. So for some reason, the problem is only in mobile android chrome.
UPDATE 11/10/19: Issue 2 has been solved by reducing canvas size and removing all shadow effects which consumed a lot of memory. Issue 1 still remains unsolved with absolutely no ideas left to try out. Any help is appreciated.
My project is 99% completed except these 2 issues. I am hoping to be able to fix them, because I really do not want to throw away months of work and switch to other javascript library for gaming, that doesn't have the problem, like PIXIJS.
I tried with RAF and RAF_SYNCHED, but still no improvement in any scenario.
Stage.update() is required for any animation. Having them on ticker is the reason why its getting slower.
To see the problem in action, please open this URL: http://www.nevergone.biz/DEMO_CODE/index.html
How to test: Open the link above in Android Google Chrome portrait mode and then click SPIN. During SPIN click above the game canvas or anywhere. Notice that everything freezes.
The code was extracted only for testing these issues, so after a few spins it may freeze. I will fix this tomorrow, but I hope someone can give some ideas for solving the problem.
Problem #1 is apparently isolated on some older devices that use Android Google Chrome. The problem is somehow caused by CREATEJS using too many listeners on the stagedown event. I am currently waiting for the developer of the framework to give an answer or for Chrome to receive a serious update.
Problem #2 was fixed by removing all text-shadow CSS effects which apparently were consuming a lot of memory.
cache might work.
var testShape=new createjs.Shape();
testShape.graphics.beginFill("red").rect(0,0,100,100);
testShape.cache(0,0,100,100);
stage.addChild(testShape);
// If you make changes and want to refresh the cache
testShape.updateCache()
I am working on this site "http://tinyurl.com/joblnmd". On home page there'gif animation, I've used preload method to load images, its working on all major browsers expect safari on Mac.
Is this bug in safari or is there any hack?
New Post: I've looked at the site again and there doesn't seem to be any problems. The loading hourglass appears for a long time, but it eventually disappears and the main content of the page is visible. It might be best for your to provide a JSFiddle with just the area in question so that I, or someone else, can have a proper look and help you solve your problem.
Old Post: Maybe you need to update your browser. My Mac Safari appears to show everything perfectly. But I'll check again later tonight. The animation looks very nice.
After updating Google Chrome browser to the latest 15.0.874.106 version (under Windows 7), my site is experiencing some weird flickering bug.
The text shadows are displaying completely wrong, the text itself is fuzzy and unclear, some parts of code don't work anymore (e.g. right floating, fixed menu)... etc.
For a couple of seconds the site is displayed fine, then it flickers all of the sudden (while still loading) and then the rendering gets messed up. (I think it has maybe some problems with loading of Google Maps v3)
The funny thing is that the old version of Chrome (before updating, on my other computer) is still displaying the site without any problems, and there haven't been any changes in the code in the meanwhile.
In other browsers (as i said, even in the old chrome) everything is OK. Firebug and Chrome's code inspector (CTRL+SHIFT+J) don't show any errors in the code. I have been doing some digging on the Internet and here as well, and I havent't found anything useful.
You can check it out by yourself by clicking here
Thanks in advance.
I have done same settings changes as mentioned above post and now, that weird flicker got stopped, below are the details....
Open Chrome Browser
Click on Settings menu option
Click on Advance setting link in Settings page
Un-Check "Use Hardware acceleration when available" checkbox
Restart you chrome browser
Happy Browsing....... :)
Also make sure to disable not only accelerated-compositing, but also accelerated-2d-canvas.
This is how I start google-chrome on Linux:
/opt/google/chrome/google-chrome %U --user-data-dir=/root --disable-accelerated-compositing --disable-accelerated-2d-canvas
On Windows, you might want to omit
--user-data-dir=/root
Josip Filipović apology where to do that (in Win7 by entering -disable-accelerated-compositing in properties > target field) that part disables hardware acceleration.
This is a "but it works on my machine" one and could be tricky:
I have a lightbox-style HTML dialog that shows a menu on top of a web page. It can be injected into any web page via a JavaScript bookmarklet.
One of my users is trying to use it on YouTube.com with the result that the flash movie is rendered on top of the dialog (a div with high z-index).
I can't reproduce this. It works just fine for me. The dialog shows up on top of everything else on youtube.com, the video included.
I had him save the page in Safari as Webarchive and send it to me. Even that shows the menu rendered correctly for me.
I use the exact same version of Safari (4.0.5/531.22.7) and Flash (10.1 r53, latest beta). Only difference I could find is that he uses Snow Leopard (10.6.6) and I "only" 10.5.8.
Has anybody noticed similar problems? I'm afraid that the usual wmode recommendation won't solve this (I tried & it works on my machine anyway)...
Thanks!
Mark
Turned out to be a problem with the combination of Flash Beta and Mac OS 10.6. I had the user revert to the latest production release of the Flash player and everything worked as it was supposed to.
On the page http://listtree.appspot.com/about/bEcPYABxI$6UeBDHzASwlA
if I scroll to the bottom using MSIE 8 the left hand side yellow div borders to a weird jumping up and down dance -- what am I doing wrong? I have similar pages where this isn't happening and the "developers tools" interface seems happy with the html.
Also, on the same page, why is MSIE silently ignoring my javascipt:... links? Again, I have other pages using the same techniques that seem to be working fine unde MSIE, and of course I see no problems in either firefox or safari whereever I've tried it.
Thanks in advance.
I can't reproduce the issues you're describing in IE8 on Windows 7.
I ran IE 8 on Windows XP through browser sandbox with no problems. Must be whatever you are using to render it or OS.
I give up.
I fixed the problem by switching from using DIV's to using TABLE's.
And to hell with the kittens
alt text http://aaron.oirt.rutgers.edu/kitten.jpg
here is how it looks now: http://listtree.appspot.com/...