Gradient fill?

B

Bob Altman

Hi all,

Here's another rank beginner question. What is the standard way to fill a
client-side table cell with a horizontal gradient background?

TIA - Bob
 
J

Jialiang Ge [MSFT]

Good afternoon Bob

There are several methods to create a horizontal gradient background for a
client-side table cell:

**** METHOD 1. Use CSS ****
If you're fine with restricting to IE then we can create gradients using
CSS filters (the Microsoft homepage did this for a long while): see
http://msdn.microsoft.com/en-us/library/ms532997(vs.85).aspx.
This only works for IE. It cannot be rendered by Firefox, Safari, etc.

However, some community members enhanced this solution by adding the
cross-browser support:
http://weblogs.asp.net/pleloup/archive/2005/12/22/433775.aspx
<quote>
This has been tested and verified to work in MSIE6, Firefox 1.0.7, Safari
2.0.1, Opera 7.5 & 8.5 on Windows 2K, XP and OS X.
</quote>

Strength: We can dynamically define the gradient color range.
Weakness: The performance is relatively lower than METHOD 2

**** METHOD 2. Stretch a static image to fill the table cell ****
If you know what the start and end colors are in advance, we can pre-design
an image with the expected gradient color range, then load and stretch the
static image to the table cell.

Strength: Better performance.
Weakness: The background image need to be pre-designed, so we cannot
dynamically change the color range of the gradient effect.

By the way, some people may suggest using GDI+ to programmatically create
such an image in method 2 so that we can dynamically change the start color
and the end color. For example: http://www.devx.com/vb2themax/Tip/18733.
Please note that this is not an supported behavior. GDI+ is not supported
to be used in ASP.NET, ASP, or windows service. This may lead to some
unexpected results.
http://msdn.microsoft.com/en-us/library/system.drawing.aspx

Please let me know whether the suggestions above are helpful to you. If you
have any other questions or concerns, DON'T hesitate to tell me.

Regards,
Jialiang Ge ([email protected], remove 'online.')
Microsoft Online Community Support

Delighting our customers is our #1 priority. We welcome your comments and
suggestions about how we can improve the support we provide to you. Please
feel free to let my manager know what you think of the level of service
provided. You can send feedback directly to my manager at:
(e-mail address removed).

==================================================
Get notification to my posts through email? Please refer to
http://msdn.microsoft.com/en-us/subscriptions/aa948868.aspx#notifications.

Note: The MSDN Managed Newsgroup support offering is for non-urgent issues
where an initial response from the community or a Microsoft Support
Engineer within 1 business day is acceptable. Please note that each follow
up response may take approximately 2 business days as the support
professional working with you may need further investigation to reach the
most efficient resolution. The offering is not appropriate for situations
that require urgent, real-time or phone-based interactions or complex
project analysis and dump analysis issues. Issues of this nature are best
handled working with a dedicated Microsoft Support Engineer by contacting
Microsoft Customer Support Services (CSS) at
http://support.microsoft.com/select/default.aspx?target=assistance&ln=en-us.
==================================================
This posting is provided "AS IS" with no warranties, and confers no rights.
 
B

Bob Altman

"Jialiang Ge [MSFT]" said:
Good afternoon Bob

There are several methods to create a horizontal gradient background for a
client-side table cell:

**** METHOD 1. Use CSS ****
[snip]
**** METHOD 2. Stretch a static image to fill the table cell ****
[snip]

Thanks Jialiang, that's just what I was looking for.
 
B

Bob Altman

"Jialiang Ge [MSFT]" said:
**** METHOD 2. Stretch a static image to fill the table cell ****
If you know what the start and end colors are in advance, we can
pre-design
an image with the expected gradient color range, then load and stretch the
static image to the table cell.

Please let me know whether the suggestions above are helpful to you. If
you
have any other questions or concerns, DON'T hesitate to tell me.

Hi Jialiang,

I posted a follow-up question over in the
microsoft.public.dotnet.framework.aspnet newsgroup (since this is an ASP.Net
question).
 
J

Jialiang Ge [MSFT]

Hi Bob,

I've replied your follow-up question in the asp.net newsgroup. If you have
any other questions or concerns, please DON'T hesitate to tell me.

Regards,
Jialiang Ge ([email protected], remove 'online.')
Microsoft Online Community Support

=================================================
Delighting our customers is our #1 priority. We welcome your comments and
suggestions about how we can improve the support we provide to you. Please
feel free to let my manager know what you think of the level of service
provided. You can send feedback directly to my manager at:
(e-mail address removed).

This posting is provided "AS IS" with no warranties, and confers no rights.
=================================================
 
M

Mark McGinty

Bob Altman said:
"Jialiang Ge [MSFT]" said:
Good afternoon Bob

There are several methods to create a horizontal gradient background for
a
client-side table cell:

**** METHOD 1. Use CSS ****
[snip]
**** METHOD 2. Stretch a static image to fill the table cell ****
[snip]

Thanks Jialiang, that's just what I was looking for.

If you make the static image a transparent gray-scale gradient (.gif or
..png) with white as the transparent color, you can stretch it to fit inside
of a DIV with background-color set to anything you want -- thus giving you
dynamic choice of gradient color. (The only thing that remains static is
the pattern density of the gradient.)


-Mark
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,764
Messages
2,569,567
Members
45,041
Latest member
RomeoFarnh

Latest Threads

Top