Fuzzy Mouse Over

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.

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

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.

Quote:

---

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

Correct version of file.

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!!

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

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.

Hi Mike,

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

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

Further to Roly's comments, never place a layer between Mouse-Off & Mouse-Over layers. Your Page Focus layer is really redundant, just place that content on the Mouse Off layer.

Somehow you've also stripped the page names. I've reapplied them in the attached xar file.

Note the navbuttons working in preview ;)

They don't.

You have to export the file as an htm file then open that file in a browser. Then the mouseover works. If simply viewed in preview they do not work.

Well that is the experience I am having and have experienced this I have gone back to the web designer premium help for preview and lo and behold it tells you that mouse over won't work................


Previewing Your Website

When creating your website in Web Designer Premium, your working document shows an accurate static preview, but to check the behavior of pop-ups, mouseover effects and Flash and other widgets it's necessary to use true Browser Preview.

Thank you. I have absolutely no idea how I could have taken the page names away nor indeed how to replace them so thank you.

But I can assure you that I haven't added any layers, at least not knowingly. I have just reloaded the original pages from the design galley and they do not have a layer called page focus. So please excuse my ignorance but I have no clue where this layer has come from.

I will attempt Roly's changes and see if I can get the mouse over next to mouse off by removing page focus and hope that this doesn't have any other impacts.

Thank you Roly and Egg this worked no fuzziness now. I still do not know what created the page focus layer.

Can you remember what template you used?

Hi JohnMike, could it be that you created the "page focus" layer when you put in the placeholder on page 4 and thereafter you put in the pictures for pages 1,2 and 3 after and did not realize that you were on the page focus layer.

Ciao

Roly

Using Xara's products is a learning experience for us all.
When discovering a new method or approach, don't be afraid to create a trial design file just for that one purpose.
Doing so forces you into a build-test cycle rather than trying to change everything all at once.

Deconstructing a template is a good place to begin as are all the videos offered by Xara and TGers.

Just don't give up on the tool,
Acorn