Code Monkey home page Code Monkey logo

Comments (11)

wavded avatar wavded commented on July 18, 2024

This may be akin to what is happening over in issue #9 (also webkit based)

from humane-js.

H0rst avatar H0rst commented on July 18, 2024

I just tested humane.js and have included it into an phonegap app. On a android 2.2 device i have a empty page, after the message is disapeared. Content doesen't come back when i scroll.
On a honeycomb tablet (Android 3.2) all works fine.

Edit:
A quick workaround is adding a function:
humane.info("Test",function(){document.body.style.backgroundColor="#fff"})

But the color have to be different to the original color. Example: When background-color of body is set with css to fff and you use the example above, it doesen't work. Content is gone.
When the color is set to anything other, it works. Also when called multiple and color is already fff.
Also it works when the color is initial fff and i use this:
document.body.style.backgroundColor="#888"
humane.info("Test",function(){document.body.style.backgroundColor="#fff"})

Weird....

BTW: little flickering also happens, but this is no problem on android. Android apps need a little flickering and jerking. ;-)

from humane-js.

wavded avatar wavded commented on July 18, 2024

There is a known webkit issue that is referenced in #9, my gut is it got fixed in the updated OS. I was able to work around some of it using z-index instead of visibility. It is related to the stylesheet and not the JS. All the JS does it apply the class and throw it back the the browser to animate to that class and that where the flickering comes in. I have been trying hacks to get it to work but haven't been successful, if you come across one that works well, please let me know!

from humane-js.

H0rst avatar H0rst commented on July 18, 2024

I don't think it is the same problem. The whole page is lost. But i believe, it is a android webkit bug, too. I have made some tests today and get strange results. All my workarounds haven't worked, too.
I have tested also in Emulator, to check, if it is some HTC Sense issue. But it happens on all 2.x versions, and it works on 3.x.

from humane-js.

wavded avatar wavded commented on July 18, 2024

I just tested iOS 5 and the flicker there is gone as well.

from humane-js.

wavded avatar wavded commented on July 18, 2024

Confirmed new Android 4 has the flicker gone, noticed that the jqmobile peeps have had better success there as well. I may just fallback to JS animation for older OS.

from humane-js.

wavded avatar wavded commented on July 18, 2024

updated code to work without any glitches on iOS v5 and Android 4, it may have had a positive affect on iOS <5 or Android <4 but currently don't have any devices to test.

from humane-js.

H0rst avatar H0rst commented on July 18, 2024

The demo page now works on a Android 2.2 Device. !!!
Thanks a lot. Can you explain what you have changed?

from humane-js.

wavded avatar wavded commented on July 18, 2024

Apparently, earlier versions of mobile webkit did not like it when you animated the zIndex property, which we don't really need to animate but to make it easier to get up and running all themes just by using transition: all instead of specifying all the components. It wasn't obvious that this was causing the issue until iOS5 where you saw the element 'behind' other elements at the start of the animation, and in front after... so anyway yippee!

from humane-js.

H0rst avatar H0rst commented on July 18, 2024

Yippee!
Thanks for the info. I plan to use humane.js in my blood pressure tracker ( http://www.bloodpressuredb.com ), when new values are saved. It runs in every browser and as phonegap based app on iOS and Android. So i love to have a easy to use library.

from humane-js.

wavded avatar wavded commented on July 18, 2024

hey awesome! glad to hear!

from humane-js.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo 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.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.