I'd like to build a website with a small start animation which should support transparency.
I found this small tutorial that is working great: http://www.sciencelifeny.com/transparency/transparency.html
It is based on a video that shows both the RGB channel and the alpha channel. In the JS application, the video data is read, merged and rendered to a canvas element.
I implemented this solution and it works in Chrome and FF, but not in Safari.
Here is my implementation: https://github.com/niels-garve/canvas-video
Can someone please have a look and help me with this? That would be so great! I am at a loss and need help.
I tried a few things:
I thought that creating the HTML structure by using document.createElement expressions would crash Safari, but it doesn't seem like that.
Also the 2D context is working well. I tried to render a simple square on canvas, which was working out well in Safari. It seems it doesn't like the video data?
I will try to document my code on GitHub this weekend, but I really followed the instructions in the above tutorial.
I would be so glad if someone helped me out with this. Thank you so much in advance!
Cheers
Niels
I deployed my solution on the development environment I'm working with, where the animation is running well on Safari. So I guess there's something wrong with my local websever configurations.
Cheers
Niels
Related
Based on my experience and research, the out-of-the-box AV players for both Android and iOS do not fully support gapless/seamless looping. There is always a noticable gap when setting the isLooping=true on any of them. I have only been able to get this to seamlessly work on Android using the SoundPool, but that is only for small sound files, not large mp3's.
Currently, i wrote a solution that "semi-works" for iOS, but the weird thing is that it does not work on Android. I would guess they should at least be consistent?
Also, I'm interested if anyone could help solve this age-old problem of looping sounds in the most effective way possible where the user does not notice a gap. This cross fader idea is out of the box and maybe someone can help improve on it. I also opened a discussion on the expo forum and will update here if anything comes from there.
Here is the repo: https://github.com/happyruss/expo-fader-loop
Any suggestions on solving the issue would be awesome. It's also a fun simple project for someone trying out react-native/expo
I need help in webRTC.
I am developing an application in which I need to share only some part of screen using webRTC.
I am able to share whole screen using it.
But I want to share some element of screen.
Anyone can help me please?
I was experimenting with this some time ago and came up with this. Maybe it will help.
Chrome only!
https://andersevenrud.github.io/webrtc-screenshare-crop/
Edit: Uploaded the source to github and created a full implementation example -- it comes with some limitations (image size over RTC), but those can be solved.
the effect i want to realize is just u can see from website below:
http://www.designasaurus.co.uk/page2/page9/page9.html
i do really want to realize this effect mainly using jQuery/js combined with html and css. And the i'll put these resources under the assets of my Android project, so i can view this effect on my Android devices. Hoping some one can give me some tips or referenceing websites to realize it, or u can just tell me that: hey, buddy! u cann't realize it in you Android project.
Edit: No luck in Android Browser. Before WebGL, however, I would look into canvas Transform methods:
https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Transformations
Start at "A Scale Example"
These should be less bleeding edge than WebGL
/Edit
To be honest, I'm a little behind on the latest CSS3 stuff but it sounds like CSS transforms would fit the bill.
I imagine android default browsers are pretty much Chrome. Looks like you could find some leads on how to do it with CSS here. See the bottom-most example.
http://css3.bradshawenterprises.com/transforms/
Not sure how smooth that would go with a background image though.
For more complete control, you'd probably want to look into webGL which is still pretty bleeding edge but no more so than the latest CSS3 but the CSS3 might be all you need here.
I'm using Raphael javascript library to make graphics.
I've almost copied the Analytics example from the webpage and I'm getting a white and black color graphic in internet explore and I don't know why.
Please see this is how it works on Firefox, Chrome and Safari:
http://imageshack.us/photo/my-images/861/75172783.png/
And this in InternetExplorer:
http://imageshack.us/photo/my-images/847/94131171.png/
Thanks!
Thanks for the Help.
However, I managed to fix the problem. I don't know why VML didn't like that Raphael object was inside a div with a "-".
This was my structure:
Simply taking the graphic outside the on-data div worked. Very weird actually!
Thanks!
From my answer to another Raphael/IE related problem:
Have you tried using Raphael 2.0? I think it's still in beta stage, but I found that it's got improved VML capabilities.
Also be sure to test browser behavior with an uncompressed version of Raphael, as minified versions seem to have bugs. Instead, I've used Packer by Dean Edwards, which gave me a compressed and bug free version of the lib.
There is a page that uses PHP to fetch search results from Google Search API and then it puts the results on the page some funny way in a circle. The code may look crappy but seems that it works more or less fine in Firefox. When you enter a search query and click submit button or Next/Previous links, it fills the wheel with results. The problem is its work in IE. It works there very slowly and then it doesn't clear the wheel before filling in new data, but puts it over that. My friend asked me to help him with this code. Please give me a piece of advice how I can fix it. Thanks so much!
Raphael runs very slowly under IE documented here.
As I understand it, VML itself in IE is fast enough, but the Raphael layer has some inefficiency.
I see you're using Raphael.js, which renders vector in VML/SVG (depending on browser). IE8 has degraded support for VML, unfortunately, and I hear it's also quite a bit slower than IE7. BTW, in IE7 it's kinda funny looking.
In terms of Raphael, it may be something as simple as resetting some context, I'm not sure. I've looked at Raphael before, but never used it.