Mouseover script help?

Somebdy help with the followin html+javascript code.?

  • <html> <head> <script> function big(a) { a.style.fontSize=40; } function small(a) { a.style.fontSize=20; } </script> <body> <span onmouseover="big(this)" onmouseout="small(this)">H</SPAN> <span onmouseover="big(this)" onmouseout="small(this)">E</SPAN> <span onmouseover="big(this)" onmouseout="small(this)">L</SPAN> <span onmouseover="big(this)" onmouseout="small(this)">L</SPAN> <span onmouseover="big(this)" onmouseout="small(this)">O</SPAN> </body> </html> when you save it in html extension and run it and move your mouse over it, the text begins to jump here and there, i am helpless, plz help I Want the text to remain "fixed" when the mouse is not over it. For example, if i move the mouse on H, i want the remaining letters(E,L,L,O) to remain fixed, but as you move the mouse on H, (its size increases,fine,but) but the remaining letters still move from their places, it dont want that to happen... Similarly if you move your mouse over E then H's size will reduce, fine, but still it will move frm its original place... collectively, i want every letter to increase its size on mouseover (with other letters remaining static) and shrink on onmouseout THE IDEA IS TO INCREASE SIZE OF TEXT THE MOUSE IS OVER, AND TO KEEP OTHERS STATIC BUT THE PROBLEM IS THE SIZE INCREASE BUT OTHERS DONT REMAIN "STATIC"

  • Answer:

    If you increase the font size you are increasing the width of a letter as well as the height so the letters in your case naturally try to push each other out of the way to make room. What you need is more control over the individual positioning of each letter though this will inevitably impose it's own limitations. You could try something like the following - though you may need to play around with the CSS depending what font you are using: http://paste.pocoo.org/show/XJIy9zFGXmD1RzFXbpCm/ http://pastebin.com/vnuS5QbS

Sandeep at Yahoo! Answers Visit the source

Was this solution helpful to you?

Other answers

If you increase the font size you are increasing the width of a letter as well as the height so the letters in your case naturally try to push each other out of the way to make room. What you need is more control over the individual positioning of each letter though this will inevitably impose it's own limitations. You could try something like the following - though you may need to play around with the CSS depending what font you are using: http://paste.pocoo.org/show/XJIy9zFGXmD1RzFXbpCm/ http://pastebin.com/vnuS5QbS

Emissary

I told you once before here, http://answers.yahoo.com/question/index;_ylt=AjKDwB3nZxgUrUR5pi.6vZvty6IX;_ylv=3?qid=20120401034453AA0wkWc , what your problem is. You will have to set a "box" width/height to cover the font size change for each letter. Center the letter to be moused over. Any increase in text size will be inside the "boxes" and shouldn't affect the other "boxes". Ron

Shadow Knows

Without looking at your code, I can already tell the other letters are moving out of the way because of the increased size of the other letter. I don't think there's any way to change that.

David

Without looking at your code, I can already tell the other letters are moving out of the way because of the increased size of the other letter. I don't think there's any way to change that.

David

I told you once before here, http://answers.yahoo.com/question/index;_ylt=AjKDwB3nZxgUrUR5pi.6vZvty6IX;_ylv=3?qid=20120401034453AA0wkWc , what your problem is. You will have to set a "box" width/height to cover the font size change for each letter. Center the letter to be moused over. Any increase in text size will be inside the "boxes" and shouldn't affect the other "boxes". Ron

Related Q & A:

Just Added Q & A:

Find solution

For every problem there is a solution! Proved by Solucija.

  • Got an issue and looking for advice?

  • Ask Solucija to search every corner of the Web for help.

  • Get workable solutions and helpful tips in a moment.

Just ask Solucija about an issue you face and immediately get a list of ready solutions, answers and tips from other Internet users. We always provide the most suitable and complete answer to your question at the top, along with a few good alternatives below.