Fuzzy Mouse Over

**JohnMike** · 28 November 2016, 07:24 PM

Hi All,

In my nav bar I have 30% grey line and fill text at 24px in Calibri Font

On Move over this changes to black line and fill.

On the mouse off and mouse over layers the text looks perfect and is in exactly the same position.

When I preview the web site or preview the web page (regardless of browser employed) the Mouse over looks fuzzy.

Zooming the preview up to 200% I see the mouse off colour under the mouse over colour.

I have tried:

Changing Font to a Standard Font
Changing Mouse over colour
Making the line colour transparent on both layers
Resizing the font on both layers
Changing the nav bar button spacing
Cleaning my glasses
Using the wife's glasses
Using grandma's magnifying glass

But what ever I do it's fuzzy and a little disappointing I didn't expect to have these sorts of issues with web designer premium.

What it appears to be is that the line colour is not apply on mouse over in the preview - but that could be fantasy on my part.

Note the text is not contained within a button.

Can anyone explain why this is happening and if there is a remedy. I thought the xara web designer would take care of such matters.

Many Thanks.

**roly** · 28 November 2016, 08:37 PM

Hi JohnMike, perhaps if you uploaded your .web or .xar file more members could take a crack at helping you with your issue.

Ciao

Roly

**Egg Bramhill** · 28 November 2016, 08:37 PM

John if I understand you correctly you are using text with a stroke (line) applied? This is not a good idea as HTML can't apply strokes to text. Secondly if you're just using text without an object below it, then even on mouse over, the mouse off text is still visible below it and does lead to an unsharp rendering.

If this isn't the case please supply a xar/web file.

**JohnMike** · 29 November 2016, 07:55 AM

Originally Posted by Egg Bramhill

John if I understand you correctly you are using text with a stroke (line) applied? This is not a good idea as HTML can't apply strokes to text. Secondly if you're just using text without an object below it, then even on mouse over, the mouse off text is still visible below it and does lead to an unsharp rendering.

If this isn't the case please supply a xar/web file.

Hi Egg,

Thank you yes I have applied a line and a fill. I wondered if this was a problem. Now I know.

I also wondered if the text needed a container. I will have a go at adding a container and removing the line.

I had given up and gone for an underline. But I would prefer the colour change.

Here is the .web file. Please don't laugh at my wording I am better at crafting wood than words.

Thanks Mike

**JohnMike** · 29 November 2016, 08:00 AM

Correct version of file.

**JohnMike** · 29 November 2016, 09:02 AM

Hi Egg,

This is very annoying. I added the stretch button x 4 from the gallery instead of the nav bar.

I edited each of the stretch button with the appropriate text in the correct font and size.

On the Mouse over layer the font and size are not reflected. So I tried making each of the stretch button a soft group. This made no difference to the editing. I went back deleted everything started again and edited the layers as appropriate.

I selected all of the stretch buttons and created a nav bar.

I preview the website.

Mouseover does nothing.

This is like pulling teeth. Surely this should be dead simple and not a total pain.

I think I will give up for now and go back to underline. I cannot spend days on this.

I thought Web Designer was meant to do all this for you!!

**roly** · 29 November 2016, 09:44 AM

Hi JohnMike, not sure if this will help your fuzziness but perhaps try the following.

Unlock your page background and slide your grid off from the background
Remove the white background by right clicking the clear fill box at the bottom left (the one at the right of the eyedropper) and click clear fill color
You will now see the grey boxes behind the navbar
Click your navbar once and slide the clear fill box over the light grey background, in the popup chose the white color then click replace
The background should now be gone
Bring back your grid and then preview. Also bring the navbars to the front of their respective layers.

Let us know if this works for you.

Ciao

Roly

**JohnMike** · 29 November 2016, 09:49 AM

Ok can we write to Xara and have a MASSIVE health warning pop up when you select Preview WebSite. Because IT DOESN'T do a proper preview. My god I have wasted so much of my day here. Mouse overs ARE NOT displayed in the preview. Surely this needs a massive flag to say hey guys this preview isn't complete you need to publish or export your files to see it correctly in like 100px red flashing letters with an audible siren warning. Indeed why not take it away completely as it is misleading or correct it so that it does correctly display the web site.

I have wasted so much time.

**Egg Bramhill** · 29 November 2016, 10:00 AM

Hi Mike,

Mouse overs work fine in Preview. What's your issue?

**roly** · 29 November 2016, 11:23 AM

Hi JohnMike, move the page focus layer down between mouse off and page background and all will be ok.Forgot to mention do that for the 4 pages. Finally if you look at "Layer ordering in website documents" in the help screen you will find some very valuable information on do's and don'ts.

Ciao

Roly