Home › Forums › JavaScript › CSS transitions don't work on newly appended elements.
- This topic is empty.
-
AuthorPosts
-
August 4, 2014 at 12:57 pm #177580
nixnerd
ParticipantI’m using jQuery to
.append()
the DOM with new elements. Now, I’m attempting to use.addClass()
to apply transitions via CSS. However, transitions don’t work on newly appended elements… I knew this.Now, I’m wondering: What’s my best course of action? Should I just animate the elements with jQuery instead of using
.addClass()
?August 4, 2014 at 1:16 pm #177590nixnerd
ParticipantSorry. I’ve realized that’s not actually my problem. It’s not that the transition isn’t working. I’m having trouble calling a function.
August 4, 2014 at 2:25 pm #177619nixnerd
ParticipantSorry @Soronbe… I figured it out. Didn’t make that very clear.
My function was structured like this:
$('.phone').on('input', function phoneCheck(){ // Stuff here... )}
$(document).on('input', '.phone', function phoneCheck(){ // Stuff here... )}
August 5, 2014 at 11:51 am #177766__
ParticipantDon’t know if you figured this out yet…
If you want to name the function, define it elsewhere and reference the name:
function phoneCheck(){ /* stuff here */ } $(document).on( 'input', '.phone', phoneCheck );
otherwise, make it an anonymous function:
$(document).on( 'input', '.phone', function(){ /* do phoneCheck stuff */ } );
August 5, 2014 at 11:59 am #177769nixnerd
ParticipantI’ll make them anonymous when I’m finished. But, I’m not sure if I’ll have to ref in another part or not. That’s why I named them.
August 5, 2014 at 12:00 pm #177770nixnerd
ParticipantDon’t know if you figured this out yet…
And yes, I got it figured out… well, this part at least :)
August 5, 2014 at 12:38 pm #177788__
ParticipantI’ll make them anonymous when I’m finished. But, I’m not sure if I’ll have to ref in another part or not. That’s why I named them.
Either way works. As a side note, I have stopped using named functions entirely in favor of assigning anon functions to variables/ properties.
var phoneCheck = function(){ /* do phoneCheck stuff */ };
This allows you to reference them, plus is better for modular code (managing dependencies, scope, etc.).
August 5, 2014 at 12:48 pm #177792nixnerd
ParticipantEither way works. As a side note, I have stopped using named functions entirely in favor of assigning anon functions to variables/ properties.
You know.. I played around with that method for a bit and couldn’t tell if I liked it… but now that I’m looking at it, I think it will help me solve a problem I have.
*Brain: Store that.
August 5, 2014 at 12:49 pm #177793nixnerd
ParticipantI’m in favor of not assigning it to a var OR naming it if I don’t have to! :)
August 5, 2014 at 1:05 pm #177800__
ParticipantIf you’re only using it once, yeah, no way.
What I realized recently, though, is that how/where I create an anon function (i.e., a closure) has less to do with how/where or how many times I want to use it, and more to do with how I want it to be scoped (i.e., which vars I want it to close around).
-
AuthorPosts
- The forum ‘JavaScript’ is closed to new topics and replies.