# Making an object rotate **URL:** \ **Category:** Ignition\ **Tags:** perspective\ **Created:** [July 8, 2024, 3:49pm UTC](https://forum.inductiveautomation.com/t/making-an-object-rotate/92903 "2024-07-08T15:49:12Z")\ **Posts on this page:** 9\ **Page:** 1
**Author:** ![Mitchell\_Gerber](https://avatars.discourse-cdn.com/v4/letter/m/e19adc/32.png) [@Mitchell\_Gerber](https://forum.inductiveautomation.com/u/Mitchell_Gerber)\ **Post date:** [July 8, 2024, 3:49pm UTC](https://forum.inductiveautomation.com/t/making-an-object-rotate/92903/1 "2024-07-08T15:49:12Z")
I am trying to make a fan spin when a tags value is one and stop spinning when it is 0. I have a script that runs on startup and it works however once the value is changed the script no longer works (the fan won't stop). Is there a better way to do this? Thanks! ---
**Author:** ![Bushmatic](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/bushmatic/32/87014_2.png) [@Bushmatic](https://forum.inductiveautomation.com/u/Bushmatic)\ **Post date:** [July 8, 2024, 3:51pm UTC](https://forum.inductiveautomation.com/t/making-an-object-rotate/92903/2 "2024-07-08T15:51:16Z")
I would do this with CSS and a tag binding -- no script. Can you post your script as a starting point? ---
**Author:** ![lrose](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/lrose/32/62724_2.png) [@lrose](https://forum.inductiveautomation.com/u/lrose)\ **Post date:** [July 8, 2024, 3:54pm UTC](https://forum.inductiveautomation.com/t/making-an-object-rotate/92903/3 "2024-07-08T15:54:14Z")
> [@Animation for Symbol Factory In Perspective](https://forum.inductiveautomation.com/t/animation-for-symbol-factory-in-perspective/63110/11): > > You can do like @Matthew.gaitan has shown, that will definitely work, however, you can also just piggyback on IA’s own animation class as well. [image] The animation value is: ia\_symbolComponent\_\_animate--rotate linear infinite The transform-origin comes from the center point used in element 4 of the SVG. ---
**Author:** ![Mitchell\_Gerber](https://avatars.discourse-cdn.com/v4/letter/m/e19adc/32.png) [@Mitchell\_Gerber](https://forum.inductiveautomation.com/u/Mitchell_Gerber)\ **Post date:** [July 8, 2024, 3:54pm UTC](https://forum.inductiveautomation.com/t/making-an-object-rotate/92903/4 "2024-07-08T15:54:35Z")
Here is the scrip this far. ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/d/7/d7a4aef79b8604740ffe87e3532596c1b0afc199.png) ---
**Author:** ![lrose](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/lrose/32/62724_2.png) [@lrose](https://forum.inductiveautomation.com/u/lrose)\ **Post date:** [July 8, 2024, 4:08pm UTC](https://forum.inductiveautomation.com/t/making-an-object-rotate/92903/5 "2024-07-08T16:08:40Z")
Yeah, don't do that. 1. time.sleep() is evil in Ignition. Anytime you're using it, you are almost certainly doing something wrong. 2. with a for loop inside of a while loop, you will see long delay's between when the tag value changes to 0 and when the spinning actually stops, because the for loop must complete execution before the while loop examines it's loop condition again. Potentially 8.75 seconds of delay (due to the `time.sleep()` commond), on top of normal network latency. 3. Once you've read the tag, you are never updating the `'spin'` variable, which means this is an infinite loop (a.k.a. memory leak). Once you're in the loop, you will never exit. The better way to do this is with an expression binding and a CSS class. ---
**Author:** ![Mitchell\_Gerber](https://avatars.discourse-cdn.com/v4/letter/m/e19adc/32.png) [@Mitchell\_Gerber](https://forum.inductiveautomation.com/u/Mitchell_Gerber)\ **Post date:** [July 8, 2024, 5:01pm UTC](https://forum.inductiveautomation.com/t/making-an-object-rotate/92903/6 "2024-07-08T17:01:16Z")
Thanks! Could you give me an example of how to do that? ---
**Author:** ![Bushmatic](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/bushmatic/32/87014_2.png) [@Bushmatic](https://forum.inductiveautomation.com/u/Bushmatic)\ **Post date:** [July 8, 2024, 6:01pm UTC](https://forum.inductiveautomation.com/t/making-an-object-rotate/92903/7 "2024-07-08T18:01:42Z")
Define the animation in your CSS stylesheet. > **[Style Classes | Ignition User Manual](https://www.docs.inductiveautomation.com/docs/8.1/ignition-modules/perspective/styles/style-classes#enabling-the-advanced-stylesheet)** > > A Style Class is a group of Style settings that are saved together. Style Classes can be applied to multiple components to provide consistency in design. A Style Class enables you to define style elements in one place, and then quickly apply that... > **[rotate() - CSS: Cascading Style Sheets | MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/rotate)** > > The rotate() CSS function defines a transformation that rotates an element around a > fixed point on the 2D plane, without deforming it. Its result is a data > type. Create a property called `animation` under your fan's `style` properties. ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/0/6/068a0d4069ff7d2df74d6700881e4c28236eb51a.png) Click the binding icon (left side of that highlight above) and use a tag binding to the Manufacturing Cooling Fan 3 tag that you have. Add a map transform that returns the name of the animation you defined in your CSS stylesheet when the value of the tag is 1, otherwise return an empty string. > **[Map Transform | Ignition User Manual](https://www.docs.inductiveautomation.com/docs/8.1/ignition-modules/perspective/working-with-perspective-components/bindings-in-perspective/transforms/map-transform)** > > The Map Transform allows you to set up a map of input values to output values. Inputs can be anything from specific values or strings, to numeric ranges of values. Each input value can then be mapped to an output value, which can be a string,... ---
**Author:** ![nminchin](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nminchin/32/6911_2.png) [@nminchin](https://forum.inductiveautomation.com/u/nminchin)\ **Post date:** [July 8, 2024, 9:12pm UTC](https://forum.inductiveautomation.com/t/making-an-object-rotate/92903/8 "2024-07-08T21:12:39Z")
I much prefer to create style classes for things like this so that they're selectable, rather than having to look up or remember what options you've got. You can extend the class in the stylesheet if you need ---
**Author:** ![Felipe\_CRM](https://avatars.discourse-cdn.com/v4/letter/f/dfb087/32.png) [@Felipe\_CRM](https://forum.inductiveautomation.com/u/Felipe_CRM)\ **Post date:** [July 9, 2024, 4:16pm UTC](https://forum.inductiveautomation.com/t/making-an-object-rotate/92903/9 "2024-07-09T16:16:11Z")
One change I'd suggest is skipping the transform since it's pretty straightforward to do it all in an expression instead: ```python if({path/to/tag}, "css_class_name", "") ```