Masks don't function well with most browsers. I'm looking into an
alternative route, if this gets accomplished, well, I'll have something
to brag about. ;-)
Christopher
Karl DeSaulniers wrote:
No examples this time. sry. you got to roll your own.
If you want the limbs, I suggest Flash or emulate what flash does with divs.
Placing little divs behind the mask at specific coordinates on a javascript
timer.
GL
Best,
Karl DeSaulniers
Design Drumm
http://designdrumm.com
On Jun 19, 2015, at 7:24 PM, Crest Christopher<crestchristop...@gmail.com>
wrote:
The limbs is what I'll also need :-)
Do you have an example ? ;-)
Karl DeSaulniers wrote:
You can do something similar in jQuery and css.
You need a png that had the same color as the background of your site as its
background.
Then tree needs to be cut out of it and then saved as a transparent png.
So that it is transparent where the tree is.
Then you put that png in a div with another div inside with that png behind it
that has the background color of the tree.
Make the parent div of the png and the second div overflow:hidden;
For illustration purposes only:
<div style="overflow:hidden; height:1em;">
<img style="z-index: 1;"PNG />
<div style="top:2em;z-index:0;background-color:green;"></div><!-- animate
top:0em; with jQuery or in css if you know how -->
</div>
Then you just animate the div behind the tree PNG from bottom to top.
Wont get the nice effect on the limbs as in Flash though..
HTH,
Best,
Karl DeSaulniers
Design Drumm
http://designdrumm.com
On Jun 19, 2015, at 6:39 PM, Crest Christopher<crestchristop...@gmail.com>
wrote:
I was going to do this with HTML Canvas, as I was suggested, working with
Canvas to create the effect I want to create, isn't as pleasing as I originally
thought.
Tom Livingston wrote:
And the plot thickens...
On Friday, June 19, 2015, Crest
Christopher<crestchristop...@gmail.com<mailto:crestchristop...@gmail.com>>
wrote:
You can't add interactivity with HTML 5 video, for example
scrolling or swiping to cause the video to do something.
Tom Livingston wrote:
Embed it as an html5 video.
On Friday, June 19, 2015, Crest Christopher
<crestchristop...@gmail.com
<javascript:_e(%7B%7D,'cvml','crestchristop...@gmail.com');>> wrote:
SVG animation can't do varying line widths, I've exhausted
that avenue already.
Christopher
Philip Taylor wrote:
David Hucklesby wrote:
As that image is PHG, I doubt it.
Are we seeing the same image at top-right ? I see :
http://www.danfergusdesign.com/classfiles/oldClasses/VCB209-2Danim/thumbs/vine.png
Philip Taylor
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org<http://evolt.org> --
http://www.evolt.org/help_support_evolt/
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org<http://evolt.org> --
http://www.evolt.org/help_support_evolt/
--
Tom Livingston | Senior Front End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com
<http://medialogic.com>
#663399
--
Tom Livingston | Senior Front End Developer | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com<http://medialogic.com>
#663399
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
