Comments (9)
What iPad and iPhone are you using?
On 10/12/2013 1:26 PM, jmalatia wrote:
I've seen some references to screen flickering bugs on iOS in the
commit notes as well as in the issues section. But I'm still seeing
the flickering when a reference to skel-panels is included on the
page (even if skel-panels aren't visible at that breakpoint or even
set to go off).Viewing the examples page at:
http://skeljs.org/uploads/examples/panels-example/index.htmlI'm seeing the flickering using an iPad (iOS 6) when I zoom in....
screen flashes. Same issue on iPhone with iOS6 and
lockViewport=falseI've reproduced using v0.4.0 and v.0.4.1.
Any thoughts?
--- Reply to this email directly or view it on GitHub:
#12
from skel.
iPad 4th Gen (Retina) - iOS 6.1.3
iPhone 4s - iOS 6.1.3
Flicker happens on both Safari & Chrome on those units.
from skel.
Same deal with the stuff at html5up.net? eg.
http://html5up.net/uploads/demos/striped/
On 10/12/2013 1:44 PM, jmalatia wrote:
iPad 4th Gen (Retina) - iOS 6.1.3
iPhone 4s - iOS 6.1.3
Flicker happens on both Safari & Chrome on those units.
Reply to this email directly or view it on GitHub:
#12 (comment)
from skel.
Yes....
http://html5up.net/uploads/demos/striped/
Flickers as well.
More info: It looks like it flashes once when done zooming... almost
like the solid background is popping in front for a second and then the
text shows back again... but it happens with a page with elements that
have no background set as well. Also at times (maybe 1 out of 20 times)
when it flashes, the text never pops back up and the screen is blank and
will only appear if you touch the screen again (usually when you are
zoomed in tight).
-------- Original Message --------
Subject: Re: [skelJS] skelPanels - Screen Flicker on Zoom in/out on iOS
(#12)
Date: 10/12/2013 1:48 PM
Same deal with the stuff at html5up.net? eg.
http://html5up.net/uploads/demos/striped/
On 10/12/2013 1:44 PM, jmalatia wrote:
iPad 4th Gen (Retina) - iOS 6.1.3
iPhone 4s - iOS 6.1.3
Flicker happens on both Safari & Chrome on those units.
Reply to this email directly or view it on GitHub:
#12 (comment)—
Reply to this email directly or view it on GitHub
#12 (comment).
from skel.
But if you don't zoom there's no flickering?
On 10/12/2013 1:55 PM, jmalatia wrote:
Yes....
http://html5up.net/uploads/demos/striped/
Flickers as well.More info: It looks like it flashes once when done zooming... almost
like the solid background is popping in front for a second and then the
text shows back again... but it happens with a page with elements that
have no background set as well. Also at times (maybe 1 out of 20 times)
when it flashes, the text never pops back up and the screen is blank and
will only appear if you touch the screen again (usually when you are
zoomed in tight).-------- Original Message --------
Subject: Re: [skelJS] skelPanels - Screen Flicker on Zoom in/out on iOS
(#12)
From: aj [email protected]
To: n33/skelJS [email protected]
Cc: jmalatia [email protected]
Date: 10/12/2013 1:48 PMSame deal with the stuff at html5up.net? eg.
http://html5up.net/uploads/demos/striped/
On 10/12/2013 1:44 PM, jmalatia wrote:
iPad 4th Gen (Retina) - iOS 6.1.3
iPhone 4s - iOS 6.1.3
Flicker happens on both Safari & Chrome on those units.
Reply to this email directly or view it on GitHub:
#12 (comment)—
Reply to this email directly or view it on GitHub
#12 (comment).
Reply to this email directly or view it on GitHub:
#12 (comment)
from skel.
correct... no flicker unless you zoom.
Scrolling a page looks fine.
flicker occurs a soon as you release your fingers from a zoom (in or
out)... then it is fine until you zoom again...
additional info: using the panels (left side panel slide in/out,
right-side panel slide-in/out) all look and work great with no
flickering... in addition, other jquery hover/click show/hide elements
work fine with no flicker (unless you zoom).
from skel.
The zooming combined with the CSS transforms used by Panels might be
causing Safari/iOS to freak out. Try adding:
useTransform: false
to your panels config (at the depth as "panels" and "overlays") and see
if that affects it.
On 10/12/2013 2:04 PM, jmalatia wrote:
correct... no flicker unless you zoom.
Scrolling a page looks fine.flicker occurs a soon as you release your fingers from a zoom (in or
out)... then it is fine until you zoom again...additional info: using the panels (left side panel slide in/out,
right-side panel slide-in/out) all look and work great with no
flickering... in addition, other jquery hover/click show/hide elements
work fine with no flicker (unless you zoom).-------- Original Message --------
Subject: Re: [skelJS] skelPanels - Screen Flicker on Zoom in/out on iOS
(#12)
From: aj [email protected]
To: n33/skelJS [email protected]
Cc: jmalatia [email protected]
Date: 10/12/2013 1:57 PMBut if you don't zoom there's no flickering?
On 10/12/2013 1:55 PM, jmalatia wrote:
Yes....
http://html5up.net/uploads/demos/striped/
Flickers as well.More info: It looks like it flashes once when done zooming... almost
like the solid background is popping in front for a second and then the
text shows back again... but it happens with a page with elements that
have no background set as well. Also at times (maybe 1 out of 20 times)
when it flashes, the text never pops back up and the screen is blank and
will only appear if you touch the screen again (usually when you are
zoomed in tight).-------- Original Message --------
Subject: Re: [skelJS] skelPanels - Screen Flicker on Zoom in/out on iOS
(#12)
From: aj [email protected]
To: n33/skelJS [email protected]
Cc: jmalatia [email protected]
Date: 10/12/2013 1:48 PMSame deal with the stuff at html5up.net? eg.
http://html5up.net/uploads/demos/striped/
On 10/12/2013 1:44 PM, jmalatia wrote:
iPad 4th Gen (Retina) - iOS 6.1.3
iPhone 4s - iOS 6.1.3
Flicker happens on both Safari & Chrome on those units.
Reply to this email directly or view it on GitHub:
#12 (comment)—
Reply to this email directly or view it on GitHub
#12 (comment).
Reply to this email directly or view it on GitHub:
#12 (comment)—
Reply to this email directly or view it on GitHub
#12 (comment).
Reply to this email directly or view it on GitHub:
#12 (comment)
from skel.
That seemed to take care of the flickering.... Instead though I used:
transformBreakpoints: 'mobile'
as I'm only using panels in mobile view. Am I correct in this usage?
I assume panels.js initializes the panels framework even if no panels
are configured as like I said, even if you don't setup any panels or
overlays and include a ref to skel-panels.js the flickering occurs. For
instance if you take your standard skeljs example page with no panels
and then just add a ref to the page of:
And not setup any panels, the flickering on zoom will occur.
Thanks!
-------- Original Message --------
Subject: Re: [skelJS] skelPanels - Screen Flicker on Zoom in/out on iOS
(#12)
From: aj [email protected]
To: n33/skelJS [email protected]
Cc: jmalatia [email protected]
Date: 10/12/2013 2:14 PM
The zooming combined with the CSS transforms used by Panels might be
causing Safari/iOS to freak out. Try adding:useTransform: false
to your panels config (at the depth as "panels" and "overlays") and see
if that affects it.On 10/12/2013 2:04 PM, jmalatia wrote:
correct... no flicker unless you zoom.
Scrolling a page looks fine.flicker occurs a soon as you release your fingers from a zoom (in or
out)... then it is fine until you zoom again...additional info: using the panels (left side panel slide in/out,
right-side panel slide-in/out) all look and work great with no
flickering... in addition, other jquery hover/click show/hide elements
work fine with no flicker (unless you zoom).-------- Original Message --------
Subject: Re: [skelJS] skelPanels - Screen Flicker on Zoom in/out on iOS
(#12)
From: aj [email protected]
To: n33/skelJS [email protected]
Cc: jmalatia [email protected]
Date: 10/12/2013 1:57 PMBut if you don't zoom there's no flickering?
On 10/12/2013 1:55 PM, jmalatia wrote:
Yes....
http://html5up.net/uploads/demos/striped/
Flickers as well.More info: It looks like it flashes once when done zooming... almost
like the solid background is popping in front for a second and
then the
text shows back again... but it happens with a page with elements that
have no background set as well. Also at times (maybe 1 out of 20
times)
when it flashes, the text never pops back up and the screen is
blank and
will only appear if you touch the screen again (usually when you are
zoomed in tight).-------- Original Message --------
Subject: Re: [skelJS] skelPanels - Screen Flicker on Zoom in/out
on iOS
(#12)
From: aj [email protected]
To: n33/skelJS [email protected]
Cc: jmalatia [email protected]
Date: 10/12/2013 1:48 PMSame deal with the stuff at html5up.net? eg.
http://html5up.net/uploads/demos/striped/
On 10/12/2013 1:44 PM, jmalatia wrote:
iPad 4th Gen (Retina) - iOS 6.1.3
iPhone 4s - iOS 6.1.3
Flicker happens on both Safari & Chrome on those units.
Reply to this email directly or view it on GitHub:
#12 (comment)—
Reply to this email directly or view it on GitHub
#12 (comment).
Reply to this email directly or view it on GitHub:
#12 (comment)—
Reply to this email directly or view it on GitHub
#12 (comment).
Reply to this email directly or view it on GitHub:
#12 (comment)—
Reply to this email directly or view it on GitHub
#12 (comment).
from skel.
Yeah. It's probably the combination of zooming + CSS transforms (which
are used as soon as Panels is initialized). Unfortunately I don't know
if there's a way around this; transforms introduce a whole new set of
viewport rules that might be conflicting with the zoom stuff.
That being said, while transformBreakpoints certainly works, using
lockViewport to disable user zooming might be the better way to go. That
way you keep the speed benefits of transforms and the flicker issue
won't come up. You'll obviously lose user zooming, but I'd argue a
properly optimized phone/tablet site shouldn't need it.
On 10/13/2013 11:16 AM, jmalatia wrote:
That seemed to take care of the flickering.... Instead though I used:
transformBreakpoints: 'mobile'
as I'm only using panels in mobile view. Am I correct in this usage?
I assume panels.js initializes the panels framework even if no panels
<script src="skel-panels.min.js"></script>
are configured as like I said, even if you don't setup any panels or
overlays and include a ref to skel-panels.js the flickering occurs. For
instance if you take your standard skeljs example page with no panels
and then just add a ref to the page of:And not setup any panels, the flickering on zoom will occur.
Thanks!
-------- Original Message --------
Subject: Re: [skelJS] skelPanels - Screen Flicker on Zoom in/out on iOS
(#12)
From: aj [email protected]
To: n33/skelJS [email protected]
Cc: jmalatia [email protected]
Date: 10/12/2013 2:14 PMThe zooming combined with the CSS transforms used by Panels might be
causing Safari/iOS to freak out. Try adding:useTransform: false
to your panels config (at the depth as "panels" and "overlays") and see
if that affects it.On 10/12/2013 2:04 PM, jmalatia wrote:
correct... no flicker unless you zoom.
Scrolling a page looks fine.flicker occurs a soon as you release your fingers from a zoom (in or
out)... then it is fine until you zoom again...additional info: using the panels (left side panel slide in/out,
right-side panel slide-in/out) all look and work great with no
flickering... in addition, other jquery hover/click show/hide elements
work fine with no flicker (unless you zoom).-------- Original Message --------
Subject: Re: [skelJS] skelPanels - Screen Flicker on Zoom in/out on iOS
(#12)
From: aj [email protected]
To: n33/skelJS [email protected]
Cc: jmalatia [email protected]
Date: 10/12/2013 1:57 PMBut if you don't zoom there's no flickering?
On 10/12/2013 1:55 PM, jmalatia wrote:
Yes....
http://html5up.net/uploads/demos/striped/
Flickers as well.More info: It looks like it flashes once when done zooming... almost
like the solid background is popping in front for a second and
then the
text shows back again... but it happens with a page with elements that
have no background set as well. Also at times (maybe 1 out of 20
times)
when it flashes, the text never pops back up and the screen is
blank and
will only appear if you touch the screen again (usually when you are
zoomed in tight).-------- Original Message --------
Subject: Re: [skelJS] skelPanels - Screen Flicker on Zoom in/out
on iOS
(#12)
From: aj [email protected]
To: n33/skelJS [email protected]
Cc: jmalatia [email protected]
Date: 10/12/2013 1:48 PMSame deal with the stuff at html5up.net? eg.
http://html5up.net/uploads/demos/striped/
On 10/12/2013 1:44 PM, jmalatia wrote:
iPad 4th Gen (Retina) - iOS 6.1.3
iPhone 4s - iOS 6.1.3
Flicker happens on both Safari & Chrome on those units.
Reply to this email directly or view it on GitHub:
#12 (comment)—
Reply to this email directly or view it on GitHub
#12 (comment).
Reply to this email directly or view it on GitHub:
#12 (comment)—
Reply to this email directly or view it on GitHub
#12 (comment).
Reply to this email directly or view it on GitHub:
#12 (comment)—
Reply to this email directly or view it on GitHub
#12 (comment).
Reply to this email directly or view it on GitHub:
#12 (comment)
from skel.
Related Issues (20)
- Skel and Wordpress HOT 3
- Skel 1.0:( HOT 1
- Cannot get css file
- Typo in scss
- request info
- Conditionals
- Cannot read property 'grid' of undefined in skel-layout HOT 3
- skel menu nav dont work on iphone 6
- Proper docs? HOT 6
- Sending email HOT 2
- Is it possible to set row height in Grid Layout?
- once deployed, click on link does not work
- https:// HOT 1
- grid offsets not working for some reason HOT 2
- Using Skel in a template
- Articles display before scroll is finished.
- Prioritizing a cell not working for small
- skel deprecetaed
- Skel-panels documentation
- request for ideas: modify collapsed menus in skel-layers.js
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from skel.