Question

24

How to pass variable into jquery animate function properties?

rated 0 times [ 30] [ 6] / answers: 1 / hits: 15439 / 15 Years ago, mon, january 11, 2010, 12:00:00

function SlideObject(Side) {

    $(#div).animate({

        margin+Side: -1000px,

        opacity: hide

    }, 1000);

}

I would like to pass the value for Side into the name of property identifier (margin) for the animate function.

I am aware that margin+Side is not valid it is just there as a place holder. For example if I were to specify the property name manually it could be marginLeft to name one example. I would like to supply Left, Right, Top or Bottom as the parameter for the SlideObject function.

I'm having trouble do this and an example would be wonderful.

Thanks

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

aileent

Add To Favorites

Follow

Total Points: 556

Total Questions: 107

Total Answers: 101

Location: Croatia

Member since Fri, Sep 11, 2020

4 Years ago

aileent questions

1 Next.js, getStaticProps not working with component but does with page

Tue, Mar 1, 22, 00:00, 2 Years ago

1 Why am I getting Failed to load extension. Invalid value for 'content_security_policy'?

Fri, Apr 16, 21, 00:00, 3 Years ago

1 Laravel livewire model is not working when updating input field from javascript?

Sun, Nov 29, 20, 00:00, 4 Years ago

1 How to get Input field type as props in react typescript

Wed, Nov 11, 20, 00:00, 4 Years ago

1 React Native Render error missing semicolon

Fri, May 8, 20, 00:00, 4 Years ago

View All

answered 15 Years ago coleman · Accepted Answer

Firstly, don't use eval() to do this. There's no need and that opens up your site to vulnerabilities if you are in any way using user input as part of that (directly or indirectly). The right way to do this is:

<div id=div>This is a test</div>

with CSS:

#div { padding: 15px; background: yellow; }

and Javascript:

function slideObject(side) {

  var anim = {opacity: 0};

  anim[margin + side] = -1000px;

  $(#div).animate(anim, 1000);

}



$(function() {

  slideObject(Left);

});

You'll note that the opacity value is changed to 0. hide is not a valid value for opacity.

Basically you create the anonymous object and then assign a dynamic property using [].