4 Replies Latest reply on May 25, 2010 1:21 PM by Sylvia[87]

    Black and white to color

    Sylvia[87]

      Hi everybody,

       

      I'm new to catalyst, and bumped into my first problem. I want to make a website, and started creating it in illustrator and opened it in catalyst.

      I have several items and objects on the website that need to change color. For example a photo that is black and white needs to change to its original colors when the mouse roll over the item.

      I want to do that black and white to color transition on photos, vectorgraphics and text. Especially the photos are a problem.

       

      Please help me!! I need it for my final exams...

       

      thnx

        • 1. Re: Black and white to color
          Chris W. Griffith Adobe Community Professional

          Convert the element that you want the hover interaction to occur into a Custom Component. In the Pages/States panel, rename the state to 'normal', then use the Duplicate State button. Relabel this state to 'over'. Now select the asset that needs to become the colored version. You can either delete the item from the art board, and place the colored version from the library panel, or you can use the properties panel to swap the elements.

           

          Return to the top level of the project, then with this new component selected, use the interactions panel to add the "On RollOver" interaction, you can then transition to a new state where the color version of the item is shown. You can add some nice transitions as well.

          • 2. Re: Black and white to color
            Sylvia[87] Level 1

            Hi Chris,

             

            Thanx for the answer.

            But after the rollover it doesn't get back to the 'normal' state.

             

            In the meantime tried something else; made two layers for a object, a black and white one and a colored one.
            Than made a button out of the object, and on the over-button-state I disabled the view in the layerspanel (turned off the eye icon)

            I had to set the smooth transition, in order to turn off the stobe-like effect when rolling over.

             

            But I don't know if this is the proper way to do it.

             

            So I would like to try the Custom Component option, but with the item going back to normal after rollover.

            • 3. Re: Black and white to color
              Chris W. Griffith Adobe Community Professional

              I forgot to mention that you will need to add an "On Roll Out" Interaction as well to the custom component.

              • 4. Re: Black and white to color
                Sylvia[87] Level 1

                That did the trick!

                 

                Thnx for the fast reply