Resizing page alters transparency

I’ve got some white text over a box filled with a tiled translucent black .png. When I drag the browser window to a smaller size the white text appears to pop behind the translucent black object.

Not sure why. Any ideas?

http://ohair.com/__Test/index.html


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I’ve got some white text over a box filled with a tiled translucent black .png

Why not put the text within the box filled with a tiled translucent black .png?

Its not going behind - it is spilling over.

You can see this if you view using Safari. Under the View Menu enable Zoom Text Only. Now bump the text size up by using Cmd+ A couple of times will do it.

David


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Makes sense. Thanks.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Sorry, but this doesn’t work. It still goes dark when I drag the window to a narrower size or when I enlarge the text in the browser.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

It still goes dark when I drag the window to a narrower size

I think that this is actually to do with Webkit and rendering with a Hype instance on the page.

There has been mention of a similar effect happening on other sites - my apologies because I didn’t realise that was your specific problem.

I believe there is a rendering bug in Webkit affecting anti-aliasing that is more evident when there are HTML5 animations on the page - but I may be misremembering.

Is it just in Safari you are seeing it?

I found this that may or not be relevant http://www.youtube.com/watch?v=9Woaz-cKPCE

D


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I checked with Firefox and things are working properly. I have another page with a similar object but without HTML5 and it works properly in Safari.

I disabled Webkit and reoutput the animations but the problem persists.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

No issues here, looks fine in Safari


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

One of the reasons this may happen is because when an object is even a tiny bit transparent, it engages the video card in a different manner than if it is fully opaque. When you have objects in the same reference frame that are composed in different video modes, they don’t always blend the right way. The trick I have always used is to set everything to a very-slightly-not-opaque value, which brings everything into the same frame of reference.

* { opacity: 0.9999998 }

See if that helps (obviously, wrap it in a style tag and put it in the HEAD of your page).

Walter

On May 31, 2013, at 8:47 AM, Trey Yancy wrote:

I checked with Firefox and things are working properly. I have another page with a similar object but without HTML5 and it works properly in Safari.

I disabled Webkit and reoutput the animations but the problem persists.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Not sure how to configure this.

Correct?


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Nope.

<style type="text/css">
	* { opacity: 0.99998 }
</style>

Try that.

Walter

On May 31, 2013, at 9:11 AM, Trey Yancy wrote:

Not sure how to configure this.

Correct?


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

On 31 May 2013, 12:53 pm, Richard van Heukelum wrote:

No issues here, looks fine in Safari

even excellent on Chrome 27.0.1453.93 here as well. I always wonder of what the heck you’re discussing :slight_smile:

Cheers

Thomas


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I hope my version of Safari is not screwed up. If I zoom the text one step (cmd-=) or make the browser window too narrow the white text in the translucent black box thins and looks darker.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I hope my version of Safari is not screwed up

I get it as soon as the Hype animation slides in. Safari 5.1.9

It may be fine in later versions.

D


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options