Rollover Mouse effects
Eric Chatonet
eric.chatonet at sosmartsoftware.com
Sun Jan 8 02:05:11 EST 2006
Hi Ken and SupermanSlyr,
This method is perfect and easy and, as usual, very well explained by
Ken.
I would only point out a special case: when the autoArm of a button
is set to true, the mouseDown message is no longer sent by the engine
(why? I don't know :-).
Then, if you need to trigger this message (and it's often the case to
implement a 'three-states' button, you have to script all the process
by yourself :-(
i.e. trapping mouseEnter, mouseLeave, mouseDown, mouseUp and
mouseRelease...
Best Regards from Paris,
Eric Chatonet
Le 8 janv. 06 à 07:54, Ken Ray a écrit :
> On 1/7/06 9:29 PM, "SupermanSlyr at aol.com" <SupermanSlyr at aol.com>
> wrote:
>
>>
>> Hello, I thank everyone very much. I wouldn't get by without your
>> help. It
>> always seems to be the simple things I have issues with. Now I'm
>> trying to
>> figure out how to make an image have mouse-over effects. I have 2
>> of each
>> image;
>> one for when the mouse enters it, and one for when it leaves it
>> (Highlighted
>> and un highlighted). I've tried putting both image frames on the
>> card at
>> once, while trying to make the appropriate one invisible with
>> onMouseEnter.
>> I've also tried importing from my hard drive and replacing the
>> current image,
>> but so far it hasn't worked like I planned.
>>
>> Maybe I'm going about this the wrong way. How can I get the rollover
>> effects I'm looking for? I want the picture to change to another
>> picture when
>> the
>> mouse pointer is moved within it, but change back to the original
>> when the
>> mouse pointer leaves from within it. I'm sure working with a gif
>> file would
>> be
>> simpler, but I don't have a gif file creation program, so I need
>> an alternate
>> route.
>
> Your best bet would be to do this:
>
> 1) Create a button, make it transparent (turn off the Show Name and
> Opaque
> properties from the Basic section of the Inspector, and the Border
> property
> from the Icons and Borders section of the Inspector). Note the ID
> number of
> the button for step #4
>
> 2) Note down the ID numbers of each of the images you want to use
> for the
> "normal" and "rollover" states (you can click each one and check
> the ID
> number in the Inspector).
>
> 3) Select the button go to the Icons and Borders section of the
> Inspector
> for the button and set the Icon field for the button to the
> "normal" state
> image ID, and set the Armed Icon field for the button to the
> "rollover"
> state image ID.
>
> 4) Unfortunately this next step isn't in the Inspector (where it
> should be).
> Click on the "Message Box" icon in the toolbar, and type the
> following into
> the message box (substitute the ID you wrote down in #1 for
> <idGoesHere>):
>
> set the autoArm of button id <idGoesHere> to true
>
> and hit the Return key.
>
> 5) Resize the button to fit the image(s), and choose the browse
> tool. When
> you move it over the button, the image will switch to the
> "rollover" icon;
> when you roll off, it will return to the "normal" icon.
>
> Now all you need to do is hide your images (since you don't need to
> see them
> anymore - uncheck "Visible" in the Basic section of the Inspector
> for each
> one).
>
> And there you go!
------------------------------------------------------------------------
----------------------
http://www.sosmartsoftware.com/ eric.chatonet at sosmartsoftware.com/
More information about the use-livecode
mailing list