soupking

Hi Dipscom, Thanks for the response. I know, my post was a bit hit and run. I wish I could break things down swiftly but can't. Was just curious if somebody's run into this. What I have is more involved. That pen is great, thank you. but imagine the square has to zoom in and scale (width-wise) with the entire stage. Again, sorry I can't post anything, no time. Just wanted to see if this is conflict of approach was something anybody's run into. Thanks again for the response. Best, -soup

Hi GS Community, I'm building a responsive ad. The first I've ever done before. It's been quite the rollercoaster, but I've hit a real surprising problem. I'm trying to animate a DIV tag that has CSS transforms applied to it in the stylesheet: <style> #intro_p1 img{ position: absolute; left: 50%; bottom: 0; -webkit-transform: translate(-50%, 0%); -ms-transform: translate(-50%, 0%); transform: translate(-50%, 0%); max-height:95%; } </style> <script type="text/javascript" src="_js/TweenMax.js"></script> TweenLite.to(intro_p1, 1, {alpha: 1, y:"50"}, 'frame1') It will alpha, but because these transforms are applied to it to make sure it stays stuc to the bottom of the screen regardless of size, when I try to applie GSAP using x/y it just disappears. So now I'm a bit "AHHH!!!" cuz I need this thing done tomorrow and I have a lot of %transforms% to make it work responsively by design and now am scrambling to sort out workarounds becase GSAP isn't working and is really conflicting with what's styled. Has anybody run into this, know why this is happening, and/or what I can/need to do? If you take the above code and use any arbitrary image you should see what I mean. The alpha works but it can't understand GSAP when CSS transforms are applied. Sorry I don't have a github setup, but I'm in a rush. Thanks for any suggestions anybody if you have them, appreciated!

Hi GS folks, I just got done building an awful banner campaign. Actually, I'm still in it, and there's really no fault or any bad breath about the matter. It just...It's one of those that was a rolling rock that wound up in the wind and now we're finally hopefully kicking it out the door. So... This thing had four timers. Now, heh, maybe it was warranted, maybe not. But...One thing I questioned from this experience after the lovely mystery of watching banners for legths of time wondering if the damn timers are working is...would it be possible to track these thing to see if they're actually active? Like see them counting or not? Is that possible in native and if not could it be done? I've seen a lot of inspectors track CSS animation live. And GSAP has great TL capabilities. Is there something that exists to help this QA process or something that can be made? Cuz frankly, anybody who's had to watch and wait for timers realizes how lame, frustrating and (at times, no pun intended) inaccurate such a process can be. If anybody can help me smooth the timer QA troubleshoot going forward or help the community on this issue if I'm not missing something I think that'd help us get back to designing/building instead of watching time...which is kinda lame if you ask me. Thanks for reading,

Ahhh, that makes sense. As far as I can tell it's working okay now. Was just a strange poster image glitch that somehow affected the video's visibility. A case of one of those "i don't know why it wasn't working but seems alright now so..." Thanks a bunch for going above and beyond helping me especially since I'm still heathen to the Codepen. I'll be sure to give it another go if I have any more questions.

Yessir.

Hey Jonathan, I don't have any iframe tags in the page. What's more bizarre is I believe it's working. I'm not sure what to think at this point other than, heh, fine, great, stay. If I have more issues I'll try CodePen again. Thanks for the help!

Update: Just for searchability sake I was wrong. Still trying to figure out why video keeps dropping in Safari when I re-size the window.

Cool, that's good to know. What's funny is that this wasn't the fix. I think I found the problem though. I had a CSS tag referencing a poster BG that was a dead link from a template I used. I then also had a poster file in my HTML video tag markup. These both being active code conflicted with each other and some how the video disappeared and the poster JPG in the HTML markup took over. Not sure why Safari read it that way but that was the problem. I tried doing a codepen but couldn't figure out how to get the thing working on this one. I'll have to try working with something less complex starting out to get used to it I think. Thanks anyway Jonathan! Really appreciate it!

Hey Jonathan, I am using GSAP which I understand uses JQuery-like stuff? Is their library included in GSAP or is there another script I need to pull to test that code? I'm currently importing the following: <script type="text/javascript" src="_scripts/js/greensock/plugins/CSSPlugin.min.js"></script> <script type="text/javascript" src="_scripts/js/greensock/TweenMax.min.js"></script> <script type="text/javascript" src="js/greensock/easing/EasePack.min.js"></script> Should that do it? I have some additional JQuery scripts in a folder but I've never really used JQuery that much so I'm not sure what 's common? Do I need another script to run this? I am importing CSSPlugins and webkit can be affected by CSS. Wasn't sure if that was related or not. Thanks a bunch for the tip!

Hi everybody, This really isn't a GS question but I couldn't find any currently popular HTML5 forums online. If anybody does, I'm all ears. I've got this situation that when I resize my browser window in Safari, the video disappears. What' odd is that it doesn't happen every time. Has anybody had this happen before? Thanks for reading?

Excellent news. I won't forget that going forward. Thanks a bunch Carl.

Hi everybody, I'm not entirely sure if this is a GSAP question or a html5/css in general but I have this reveal to my website using the GSAP and my content loads, then disappears, then fades back in. I need it to disappear from the gate so images and text aren't showing before the reveal. There's various ways of hiding content. I'm doing one right now and it's obviously not working very well. So I was wondering if there was a relatively standard way people hide content so this sort of thing doesn't happen? Does one technique work better than another? Is it the way my mark-up is laid out? If it helps, here's the link: axiom-media.com/__staging/2014 I'm aware of the crop mark as well, but need to figure this situation out before moving forward. In any case, thanks for reading.

Ahhhh right. Got it. Heh, different from where I was coming from but I just learned what null variables are. Thanks Jack!

Heya Jack, To be honest I didn't know there were null objects in this realm. First I've heard of them was in After Effects. I ended up answering my own question, and I'm pretty sure the answer is 'yes'. Like if I have a Tween command for a clip that's not on the stage (even though I'm not using canvas...I think) putting it's instance name in a TweenLite command will break it all. I'm guessing that's what you call a null?

Hi Jack and friends, Hey, I've been going at troubleshooting the GSAP and I'm finding that when I add code for instances that aren't in the HTML markup that the whole thing seems to stop. Does the GSAP require that all coding have referenced instances to function? It seems that's the case.

I think I figured it out. If not I'll use the Codeden app in the future for sure. Thanks Jack!

Hi everybody, I'm trying to build rollover thumbnails. In doing so I have two lines of TweenLite.set(): TweenLite.set([img1, img2, img3, img4, img5, img6, img7, img8], {opacity:0}); TweenLite.set([img1_hover, img2_hover], {opacity:0}); For some reason the second line won't work unless the first line is commented out. I've tried various things to make both the thumbnail and the hover state invisible but for some reason it doesn't work unless the first line is omitted (even if I put the img1_hover instance in the first line??) Can anybody out there tell me why this happens or direct me to maybe a thumbnail rollover tutorial? I've been doing a lot of searching and haven't come up with much. Thanks for reading.

Hi everybody, First off I want to say thanks to Jack for making such an awesome platform. I don't usually program HTML docs, but when I do I choose GreenSock. I'm actually more into Cinema 4D and that sort of troubleshooting but I need to build my portfolio and I'm using a video background and don't want to deal with loading stuff through Flash. So I'm going through the motions of learning how to build a set of thumbnails in a JS environment. I have this conundrum where I have thumbnail rollovers using CSS3 alpha hover styles with two images that look great but I want to do a staggered cascading reveal of my thumbnails like I used to do in Flash. So I'm using HTML Canvas and EaseJS to animate them in. However, I'm stuck with the issue of having two sets of code where one does interaction and the other does the animating. I've run into the duality before but I'm really out of water here. If somebody could tell me what the best overall code approach would be to use a cascading/staggered thumbnail reveal and double image rollover would be for a portfolio thumbnail set I'd really be grateful. I can gravitate to anything that's out there but I'm having a hard time making CSS work in an x,y canvas environment that feels more like a vector object. How would you guys go about this? Thanks for any suggestions as I'm really a software guy these days.

I must have the wrong idea about TimelineLite. This must be more of an AS3 issue then than a Greensock issue. I'll see what I can do about this not working. Thanks Carl!

Wow, okay. heh, and I thought my studies were at a plateau. Goodness...Okay, I guess I'm going to learn about TimelineLite now. If you've seen my other post you'll know I'm retarded. Everybody's way up the mountain. I feel like a snowboarder still figuring out how to get my dang ski boot in binding. It's a bit late, so I'll probably work on this tomorrow. Thanks a bunch for the small snippet. That stuff is like gold to me. I'm a lot better at line-by-line to chew on rather than dissecting full ideas at a time. Peace, -soupking

Hi everybody, I know...dumbest question ever. But there's no example of this anywhere that I can find. I've got this: public function gotoAndStop(timeOrLabel:*, suppressEvents:Boolean = true):void and this: myTimeline.gotoAndStop(2) I've gone through documentation and examples and I can't figure out how to attach it to movieclips and what the basic syntax is. function switchMenu(m1:Number, m2:Number, m3:Number, m4:Number) { menu_mc.feature1_mc.gotoAndStop(m1); menu_mc.feature2_mc.gotoAndStop(m2); menu_mc.feature3_mc.gotoAndStop(m3); menu_mc.feature4_mc.gotoAndStop(m4); } I can't use a variable for a frame value so I was hoping TimelineLite could help. Am I right in asking? As always, thanks for reading. You guys (and you know who you are) have been very helpful.

Is there a way to ease the total stagger of AllTo? I know it's possible to ease each individual tween within, but is the entire array tween 'easable' in it's entire whole somehow?

Awesome. The first one works. Saved!!! Thank you!!! I already tried the 2nd you propose, but I've had an array of errors. Probably starting out because I didn't put in the parent container_mc. However, I never would have figured that out that the container_mc was the parent. I was threading with a gentlemen named Carl, and he said to swapDepths that I should container_mc.addChild(_imageArray). However, that then seemd odd to me because it's like I'm instance the loaded content twice. ? Anyway, this will keep me moving forward. Thanks a bunch for the help. This code snippet is much cleaner than where I was headed.

Ohhhhhhkay okay, So, I think I'm getting it more now. Yes, you're absolutely right. depth commands aren't in the ContentDisplay properties model. If this wasn't so esoteric I'd just search online. Before I had this: queue.append( iLoader = new ImageLoader("_images/"+xml.feature[i].@url, { name:xml.feature[i].@name, container:container_mc }) ); // array image by name _aImages.push(iLoader.content); Which loaded them into the container_mc, but they're not instanced on the stage as "depthable" (let's say) until I write something like container_mc.addChild(_aImages) in a loop or something. Right? Cuz I thought that somewhere in the fancifulness of the loader that it added them to the stage without my knowing. That's where I'm off-base huh? I just need to addChild(). If I'm getting this right, I should have this down shortly. I'll give it a shot. Thanks a bunch Carl. Without all the help from all you guys, I'd never get this thing built. It's just that I understand that it's hard to help people sometimes because what is "obvious" can vary quite extensively. EDIT: Yes, you're right on the money. However, I can't get getIndex(_aImages[0]), getChildIndex(_aImages[0]), or indexOf(_aImages[0]) to work. I also tried them inversely as well because it gave parenting issues and all I can get trace(container_mc.getIndexOf()); but the rest gives me errors: trace(container_mc); for (var q:Number =0; q<4; q++) { container_mc.addChild(_aImages[q]); trace(getChildIndex(_aImages[q])); //ArgumentError: Error #2025: The supplied DisplayObject must be a child of the caller. trace(indexOf(_aImages[q])); //Error #1180: Call to a possibly undefined method indexOf. trace(_aImages[q].indexOf()); //Error #1069: Property indexOf not found on com.greensock.loading.display. } This ContentDisplay just won't budge into being a stage object with a depth. Grrr. I guess I'll keep plugging away. I just don't know what I can find online as demo info. I can get an MC to show up easily. I feel like this shouldn't be so difficult, you know?

I understand the basics of the display object model. container_mc.addChild(LoadedObject_12); It's essentially the same thing I don't understand LoaderMax because I can't treat the objects loaded like MovieClips in that they are at a depth: http://www.greensock.com/as/docs/tween/ ... etail.html I can tween them, but I can't re-stack them. My major issue right now is referencing what is in the container as a separate depth. I imagine that I can GetByName, but every swapDepths, getDepth() function I've thrown at it is rejected. I want to be able to do this: http://www.as3dtk.com/?p=493 See my issue? I've seen slideshows that go back and next down the aggregated XML data or array. But I have a 4 button menu. Should I somehow in the loop store each ContentDisplay object into it's own MovieClip instead of just a container_mc. Is that the logic? Thanks for your response by the way.