Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations sizbut on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

CSS set picture hue?

Status
Not open for further replies.
NateBro

NateBro

Programmer
Sep 1, 2004
233
US
I have a web page, and i have a button that is one color, with 3D edges, and i was wanting to know if there was a way with CSS or something else, that i could change the hue of the picture to match to page background.

if you have any ideas please let me know,
and thanks so much for your time!
Nate_Bro
 
Sort by date Sort by votes
The picture that you want to change the hue of is.... ? Are you talking about the button? Have you put a picture on the button? If so, edit the picture with an image editing program.

Maybe you are referring to the 3d effect that the browser uses to display the button? -- in which case y ou need to broaden your horizons and view your pages with o ther browsers to see how they display the buttons (and all form controls) very very differently... even on the same platform.

If it is just the button colour you are trying to alter, then you can give the button a class (or an ID) and then set a stylesheet up to set the color property. You could play with the border property to set some of the 3d-like properties on the button.

Let us know a little clearly what you are attempting... and I'm sure we'll find some suggestions for you.

Cheers,
Jeff

[tt]Jeff's Page [/tt][tt]@[/tt][tt] Code Couch
[/tt]
 
Upvote 0 Downvote
ok, i sounds like I'll have to write a script in PERL to edit the picture's hue.

sorry if i was not clear on what i wanted to do, but i'm running on 5 hours of sleep this week trying to get this progect done, thanks agin for your time. have a good one!

Thanks,
Nate_Bro
 
Upvote 0 Downvote
Well, its for a page that the user selects the page colors, so i need the pict to be able to turn what ever color the people want it to be. :)

Thanks,
Nate_Bro
 
Upvote 0 Downvote
You asked open-endedly (not a word, I know) for "other suggestions". So here's mine: don't use images. Use standard HTML elements, such as anchor tags. Use border properties and the "hover" psedo-class to simulate the appearance of a button. Color the element using standard CSS.

Code: 
<html>
<head>
<style type="text/css">
a:link, a:visited
{
  float: left;
  margin: 2px 5px 2px 5px;
  padding: 2px;
  width: 100px;
  border-top: 1px solid #cccccc;
  border-bottom: 1px solid black;
  border-left: 1px solid #cccccc;
  border-right: 1px solid black;
  background: #cccccc;
  text-align: center;
  text-decoration: none;
  font: normal 10px Verdana;
  color: black;
}

a:hover
{
  background: #eeeeee;
}

a:active
{
  border-bottom: 1px solid #eeeeee;
  border-top: 1px solid black;
  border-right: 1px solid #eeeeee;
  border-left: 1px solid black;
}
</style>
</head>
<body>
<a href="#">Button 1</a><a href="#">Button 2</a><a href="#">Button 3</a>
</body>
</html>





Thomas D. Greer
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

jizzer
  • Locked
  • Question
HTML/CSS Image map with multiple tool-tips
Replies
3
Views
1K
spamjim
spamjim
Expoverse
  • Locked
  • Helpful tip
Solution to CSS Two Level Horizonal Menu 1
Replies
1
Views
809
pmonett
pmonett
PeDa
  • Locked
  • Question
CSS two level horizontal menu
Replies
0
Views
634
PeDa
PeDa
PeDa
  • Locked
  • Question
Horizontal rule and CSS problem 2
Replies
2
Views
686
PeDa
PeDa
tyutghf
  • Locked
  • Question
Achieving this grid layout in css
Replies
1
Views
221
tyutghf
tyutghf

Part and Inventory Search

Sponsor

Back
Top