Welcome to TalkGraphics.com
Results 1 to 4 of 4
  1. #1
    Join Date
    Oct 2019
    Location
    Florida, United States
    Posts
    23

    Default Web design: Buttons have slight "shifting" text on mouseover

    Hello!

    I've got some text buttons with only a color-change on mouseover that appear to have the text shifting slightly when you mouseover the buttons so that the text appears almost "blurry."

    These buttons are sitting on top of an image that is "stretchy" to fit the window width.

    The exact same buttons used elsewhere on the site do not appear to "shift" at all upon mouseover, but simply change color like they are supposed to.

    I have two different websites using a similar design with the buttons on top of a "stretchy" image that are both displaying the same text shifting/blur problem. My theory is that the code output from Xara that is making the image "stretch" is somehow also affecting the buttons sitting on top of it.

    Is this slight shift/text blur something I can fix in Xara?

    Here's a link to the websites with the buttons:

    https://www.igcshow.com/index.htm

    http://www.igcmagazine.net/TESTSITES/gca_21/index.htm

    Software: Xara Designer Pro X, Windows 10.

    Thank you for any suggestions!
    -Kelly

  2. #2
    Join Date
    Apr 2018
    Location
    Barnes, London
    Posts
    947

    Default Re: Web design: Buttons have slight "shifting" text on mouseover

    My guess is you have applied soft groups (text and rectangle) on the MouseOff and MouseOver layers, soft-grouped the two soft groups together and made the button sticky? If true and the text on the button is anything other than left-justified, you will see a distortion that shifts the text on one layer (usually to the right) which causes a blur.

    Simple workaround is group rather than soft group text and rectangle on each layer, soft group both layers and the problem does not occur; it is I believe a known gremlin! You will have to live with the fact that text then becomes a bitmap when exported as opposed to staying as text.

    I could of course be wrong, but that has been my experience of the issue and worth a try?

  3. #3
    Join Date
    Oct 2019
    Location
    Florida, United States
    Posts
    23

    Default Re: Web design: Buttons have slight "shifting" text on mouseover

    I don't have separate text/rectangles for the buttons - just a text box with a colored background, and the buttons are not sticky. I do have the text horizontally and vertically centered in the text box, however.

    Your response gives me a place to start to try to troubleshoot my issue by separating the text and the colored rectangle and/or removing the horizontal centering. Thank you very much!

    -Kelly

  4. #4
    Join Date
    Aug 2000
    Location
    Placitas, New Mexico, USA
    Posts
    41,486

    Default Re: Web design: Buttons have slight "shifting" text on mouseover

    Yeah, text (set to center justify) centered and grouped to the button shape. The button shape can be the same color as the page if you want it to appear to be text only.

    Then as suggested, with both buttons on separate layers, and both visible, select both and Arrange > Soft Group.

 

 

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •