[WSG] Miranda Cook is out of the office

[Miranda . Cook]

I will be out of the office starting  20/08/2007 and will not return until
27/08/2007.

In my absence, for Web assistance please email
[EMAIL PROTECTED] or call x46001.




NOTICE - This message is intended only for the use of the addressee named above 
and may contain privileged and confidential information. If you are not the 
intended recipient of this message you are hereby notified that you must not 
disseminate, copy or take any action based upon it. If you received this 
message in error please notify Medicare Australia immediately. Any views 
expressed in this message are those of the individual sender, except where the 
sender specifically states them to be the views of Medicare Australia.
***



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***

Re: [WSG] IE, alpha transparency and sliding doors...

[Nick Cowie]

Stephen asked:
> Could you use solid background gif and then the opacity filter in your IE6
style sheet?
> I'm not sure if you can make the child of a translucent parent opaque
though.

Yes and Yes, I was lazy and chose to do it via background colour rather than
image (is was easier to get a colour match) and you can make the child of a
translucent parent opaque. I had to go find the IE CSS for that page. But
that is what I did.
http://www.docep.wa.gov.au/presentation/style/wlieonly.css

I could not agree with Joe more:
> Impossible?  Not if you have a huge amount of time to put towards ironing
out the issues.

It will consume a couple of days to get it right in IE 5.5 and 6 if that is
what the client / boss wants and is willing to pay for then do it. You will
know for next time. Otherwise use conditional comments and feed a gif with
no shadow to IE 6 and below. Half and hour of your time instead of days.

Nick


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***

Re: [WSG] IE, alpha transparency and sliding doors...

[Joseph Taylor]

Impossible?  Not if you have a huge amount of time to put towards 
ironing out the issues.


Realistically, however:

Not only is getting .png's to work by themselves in IE a difficult task, 
but the flow of related problems is even worse.


You have problems with hyperlinks that appear over any .png images and 
sometimes other places too.  Hand cursor doesn't work in IE. 

Safari will sometimes show a different hue of your color than other 
browsers will when .png images set as backgrounds.


Links won't activate.

There's plenty of others I cannot think of right now.

Sure, these can be overcome with combinations of well-placed 
"position:relatives" and other IE pacifiers, but in most cases today I 
recommend using your alternate stylesheets to have your cake and eat it too.


Set up a separate stylesheet for anything lower than IE7.
Substitute out the .pngs that are the trouble items and replace with 
.gifs in your stylesheet. You may need to add a container div or 2 to 
your markup to make it happen.  I won't scold you for it.


Example: http://seaislerealty.com

Uses transparent .pngs all over the front page, but uses .gifs instead 
for IE.


Best solution?  I'm not claiming that.  I am claiming that it works and 
those who use the newer browsers enjoy a lightly enhanced experience.


Sites by Joe, LLC
http://sitesbyjoe.com
[EMAIL PROTECTED]


John Faulds wrote:
We're probably going to need to see your code and/or a link to the 
page to be able to make any reasonable comment.


On Wed, 22 Aug 2007 10:28:57 +1000, minim <[EMAIL PROTECTED]> 
wrote:



Hi all - I've been set what I believe to be an impossible challenge,
but before I admit defeat I thought I should cast it out into the
wilds of the internet and see if others agreed or could suggest a
solution.

The challenge is this: to create a flexible (vertical and horizontal)
content-containing box with rounded corners and drop shadows (three
sides) - over a patterned background.

The problem, of course, is IE 5.5 and 6 - I've investigated the
AlphaImageLoader filter and I can't see any way to make it do what I
want - if I use the sliding-doors method, neither left nor right
borders show up, even though the top and bottom work OK (barring the
fact that you can see the underneath sliding image in the transparent
bit going around the topmost rounded corner). I have also tested
trying to make this work using side-by-side spans, which again could
be made to work OK for the top level (fixing the over/under thing),
but which then left me with the issue where the left border showed up
OK, but the right border either didn't (because to make it stretch
the full length of the content meant I had to put it in a div
surrounding the content, but then AlphaImageLoader doesn't allow
positioning, so I couldn't shift it to the right) so it was hidden by
content, or only showed up 23px high because IE doesn't implement
height: 100% unless the bounding box's height is expressed in pixels
- no good where you have no clue how tall your content will be. I
even tried using IE's proprietary dropshadow filter with transparent
gifs for the rounded corners minus the photoshop dropshadow, but the
results were too hideous to even contemplate.

SO: Does anyone know of a way to implement such a thing, or is this
indeed, as it seems, totally impossible? I'd appreciate either sort
of response :-)

Thanks,

Caitlin.

Caitlin Rowley, B. Mus. (Hons), Gr. Dip. Design
Composer, musicologist, web designer
http://www.minim-media.com/listen/





***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***







***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***begin:vcard
fn:Joseph Taylor
n:Taylor;Joseph
org:Sites by Joe, LLC
adr:;;408 Route 47 South;Cape May Court House;NJ;08210;USA
email;internet:[EMAIL PROTECTED]
title:Designer / Developer
tel;work:609-335-3076
tel;cell:609-335-3076
x-mozilla-html:TRUE
url:http://sitesbyjoe.com
version:2.1
end:vcard

Re: [WSG] IE, alpha transparency and sliding doors...

[Jixor - Stephen I]

Could you use solid background gif and then the opacity filter in your 
IE6 style sheet? I'm not sure if you can make the child of a translucent 
parent opaque though.


Nick Cowie wrote:

Caitlin

It should be possible, depends on how much time you are willing to invest.

I have always had problems applying AlphaImageloader to background 
images. So I don't even try.


I would build the site so it worked in all modern browser.

The using conditional comments apply a special CSS for IE 5.5 & 6  
that replaces the transparent background .png files with transparent 
background .gif and use the Gradient Filter 
http://msdn2.microsoft.com/en-us/library/ms532997.aspx 
AlphaImageLoader Filter where necessary.


You can see the basic idea in the CSS here 
http://www.docep.wa.gov.au/lr/worklife/overview.html 

(it is now an ugly invalid site now, but three years ago when I last 
touched it it was clean and valid).
If you change your font size, it is an elastic site, the background 
image still appears through the semi-transparent menu background.
In IE (including 7 I built this 3 years ago) the background is a gif 
and AlphaImageloader is used on the menu div to make the whole div 
semi-transparent.
In all other modern browsers because the background is a 
semi-transparent png


Using that technique with both AlphaImageloader and Gradient filter 
should get you the results you need


Nick

***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
*** 




***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***

Re: [WSG] IE, alpha transparency and sliding doors...

[Nick Cowie]

Caitlin

It should be possible, depends on how much time you are willing to invest.

I have always had problems applying AlphaImageloader to background images.
So I don't even try.

I would build the site so it worked in all modern browser.

The using conditional comments apply a special CSS for IE 5.5 & 6  that
replaces the transparent background .png files with transparent background
.gif and use the Gradient Filter
http://msdn2.microsoft.com/en-us/library/ms532997.aspx AlphaImageLoader
Filter where necessary.

You can see the basic idea in the CSS here
http://www.docep.wa.gov.au/lr/worklife/overview.html
(it is now an ugly invalid site now, but three years ago when I last touched
it it was clean and valid).
If you change your font size, it is an elastic site, the background image
still appears through the semi-transparent menu background.
In IE (including 7 I built this 3 years ago) the background is a gif and
AlphaImageloader is used on the menu div to make the whole div
semi-transparent.
In all other modern browsers because the background is a semi-transparent
png

Using that technique with both AlphaImageloader and Gradient filter should
get you the results you need

Nick


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***

Re: [WSG] IE, alpha transparency and sliding doors...

[John Faulds]

We're probably going to need to see your code and/or a link to the page to  
be able to make any reasonable comment.


On Wed, 22 Aug 2007 10:28:57 +1000, minim <[EMAIL PROTECTED]> wrote:


Hi all - I've been set what I believe to be an impossible challenge,
but before I admit defeat I thought I should cast it out into the
wilds of the internet and see if others agreed or could suggest a
solution.

The challenge is this: to create a flexible (vertical and horizontal)
content-containing box with rounded corners and drop shadows (three
sides) - over a patterned background.

The problem, of course, is IE 5.5 and 6 - I've investigated the
AlphaImageLoader filter and I can't see any way to make it do what I
want - if I use the sliding-doors method, neither left nor right
borders show up, even though the top and bottom work OK (barring the
fact that you can see the underneath sliding image in the transparent
bit going around the topmost rounded corner). I have also tested
trying to make this work using side-by-side spans, which again could
be made to work OK for the top level (fixing the over/under thing),
but which then left me with the issue where the left border showed up
OK, but the right border either didn't (because to make it stretch
the full length of the content meant I had to put it in a div
surrounding the content, but then AlphaImageLoader doesn't allow
positioning, so I couldn't shift it to the right) so it was hidden by
content, or only showed up 23px high because IE doesn't implement
height: 100% unless the bounding box's height is expressed in pixels
- no good where you have no clue how tall your content will be. I
even tried using IE's proprietary dropshadow filter with transparent
gifs for the rounded corners minus the photoshop dropshadow, but the
results were too hideous to even contemplate.

SO: Does anyone know of a way to implement such a thing, or is this
indeed, as it seems, totally impossible? I'd appreciate either sort
of response :-)

Thanks,

Caitlin.

Caitlin Rowley, B. Mus. (Hons), Gr. Dip. Design
Composer, musicologist, web designer
http://www.minim-media.com/listen/





***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***




--
Tyssen Design
www.tyssendesign.com.au
Ph: (07) 3300 3303
Mb: 0405 678 590


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***

[WSG] IE, alpha transparency and sliding doors...

[minim]

Hi all - I've been set what I believe to be an impossible challenge,  
but before I admit defeat I thought I should cast it out into the  
wilds of the internet and see if others agreed or could suggest a  
solution.


The challenge is this: to create a flexible (vertical and horizontal)  
content-containing box with rounded corners and drop shadows (three  
sides) - over a patterned background.


The problem, of course, is IE 5.5 and 6 - I've investigated the  
AlphaImageLoader filter and I can't see any way to make it do what I  
want - if I use the sliding-doors method, neither left nor right  
borders show up, even though the top and bottom work OK (barring the  
fact that you can see the underneath sliding image in the transparent  
bit going around the topmost rounded corner). I have also tested  
trying to make this work using side-by-side spans, which again could  
be made to work OK for the top level (fixing the over/under thing),  
but which then left me with the issue where the left border showed up  
OK, but the right border either didn't (because to make it stretch  
the full length of the content meant I had to put it in a div  
surrounding the content, but then AlphaImageLoader doesn't allow  
positioning, so I couldn't shift it to the right) so it was hidden by  
content, or only showed up 23px high because IE doesn't implement  
height: 100% unless the bounding box's height is expressed in pixels  
- no good where you have no clue how tall your content will be. I  
even tried using IE's proprietary dropshadow filter with transparent  
gifs for the rounded corners minus the photoshop dropshadow, but the  
results were too hideous to even contemplate.


SO: Does anyone know of a way to implement such a thing, or is this  
indeed, as it seems, totally impossible? I'd appreciate either sort  
of response :-)


Thanks,

Caitlin.

Caitlin Rowley, B. Mus. (Hons), Gr. Dip. Design
Composer, musicologist, web designer
http://www.minim-media.com/listen/





***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***