But this is getting OT for this list so I bow out gracefully here... Best,
Karl DeSaulniers Design Drumm http://designdrumm.com On Jun 19, 2015, at 7:50 PM, Karl DeSaulniers <k...@designdrumm.com> 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/
