Best Way to do Text Rollover (On Image)?

  • I'm trying to have my hotspots start off as images and when the user hovers over them, they transform into a text object with information about the hotspot.

    So lets say there's a hotspot over a painting that looks like a little icon of a painting, when you hover over it, it turns into a large text area with information about the painting. Clicking on it pops up an image of the painting.

    I've been trying to do this in the onover and onout attributes: onover="set(url,../textfield.swf);" and onout="set(url,../images/painting1.png)"

    That technically works except the text object becomes tiny and unreadable. If I just display the text object it looks fine. Is that the best way to do it and I've got something wrong or are there better solutions/plugins for this?

    Thanks

  • Hi!
    Better way is add second text hotspot (2 hotspot)
    1 - visible, 2- hidden.
    onhover first will show second hotspot and hide first
    onout of second hotspot will hide second and show first.

    Good luck
    Andrey *thumbup*

    Oh wow that's a great idea, I don't know why I didn't tink of that. I'll try that out and maybe post the results, thanks!

    EDIT: Er ... how do I make one hotspot control another?

  • Hi!
    something like this
    1-st hotspot
    onover="set(hotspot[hs1].visible,false);set(hotspot[hs2].visible,true);"

    2-nd hotspot
    onout="set(hotspot[hs1].visible,true);set(hotspot[hs2].visible,false);"

    Regards

    Andrey *thumbup*

    Ah okay, that should have been obvious since I'm using the hotspot[name] arrays to generate these in the first place with Javascript.

    That works, although i tried using tween(hotspot[hs1].alpha,0,0.2) and tween(hotspot[hs2].alpha,100,0.2) and the PNG image has a smooth transition but the text field just turns on and off, not very pretty.

    I might see if I can make a javascript function to control these outside and then call that function with the hotspot names, maybe that will work better than trying to do all of these concurrently in the onover and onout properties.

    EDIT: Alternatively is there a tooltip feature or plugin for the flash viewer? I tried a Javascript ToolTip but Javascript can't display over Flash so the text just showed up on the side of the player.

    EDIT2: Actually the Showtext() function worked perfectly for this, it looked way better and still did what I wanted. Thanks for the help!

Participate now!

Don’t have an account yet? Register yourself now and be a part of our community!