Links within my flash movie are moving for no reason on hover (AS2)!!
Hey everyone,
I have got a very obscure problem that I cannot for the life of me figure out. I have a flash movie which contains a number of pages which contain dynamic text fields containing HTML read from my database. This works absolutely fine, however for reasons that I cannot understand when you hover over some of my links they move to the right so they are inline with the edge of the first linked image at the bottom. The code is as follows:
PHP Code:
<p><a href="http://www.testlink.com">A LINK</a></p>
<p>Test text <a href="http://www.testlink.com">ANOTHER LINK</a> More text</p>
<p><a href="http://www.spotlight.com" target="_blank"><img alt="Click to view my Spotlight CV" src="http://www.spotlight.com/img/static/weblinks/SpotlightPresenter_White.gif" title="Click to view my Spotlight CV" /></a></p>
<p><a href="http://www.twitter.com" target="_blank"><img alt="Follow on Twitter" src="http://twitter-badges.s3.amazonaws.com/follow_me-b.png" /></a></p>
With this code when you over over the 2nd link (ANOTHER LINK) this entire line (including the non link text) moves to the right edge of the spotlight image (but keeps the same vertical position). When you hover over the first link (A LINK) nothing moves at all. If i remove the images at the bottom then there are no problems and nothing moves if you hover over ANOTHER LINK. If I delete the first link (A LINK) but leave the images then similarly there are no problems and nothing moves if you hover over ANOTHER LINK. To make it even wierder I have an associated CSS file with general link styles within it (and nothing else and no other associated stylesheets):
PHP Code:
a:link{text-decoration: none;}
a:active{text-decoration: none;}
a:visited{text-decoration: none;}
a:hover{text-decoration: underline;}
If i remove the hover line completely from this stylesheet (and leave html code above as it is) then the movement problems also stop completely (but unfortunately so does the underlining of the link text). Similarly if I add a 1px by 1px image above the first image wrapped in an href tag then it doesn't move (as i guess it's moving to the edge of this which is the same place it's already in), however if i just include the 1px by 1px image with no link then it reverts to moving right to the edge of the first linked image.
I am at a complete loss as I can't find any consistencies (i've tried various different layouts with multiple links/images and it happens on some links and not others). I would be so incredibly grateful for any advise anyone can give as to anything I can try/test as I really have no idea what to do as it is so completely random!
Thanks so much for your help everyone, i am completely stumped!
Dave
