Programming Forums
User Name Password Register
 

RSS Feed
FORUM INDEX | TODAY'S POSTS | UNANSWERED THREADS | ADVANCED SEARCH

Reply
 
Thread Tools Display Modes
Old Oct 11th, 2004, 3:59 PM   #1
emdiesse
Programmer
 
Join Date: Jul 2004
Location: Hampshire
Posts: 56
Rep Power: 5 emdiesse is on a distinguished road
How do i make an image have opacity in html?
I know there is a way to do it in this:
[img]Files/Images/Site/header-3.gif[/img]

I also know it is possible without JS, what is the method?
emdiesse is offline   Reply With Quote
Old Oct 11th, 2004, 4:54 PM   #2
dnathe4th
Programmer
 
Join Date: Oct 2004
Posts: 32
Rep Power: 0 dnathe4th is on a distinguished road
<img border="0" src="Files/Images/Site/header-3.gif" width="200" height="100" style="-moz-opacity:INSERT_OPACITY%;filter:alpha(opacity=INSERT_OPACITY)">

Unfortunately, the code doesn't show up in FireFox, so the image is as opaque as always
__________________
&lt;CENTER&gt;<span style='font-size:17pt;line-height:100%'>My Homepage</span>&lt;/CENTER&gt;
dnathe4th is offline   Reply With Quote
Old Oct 11th, 2004, 10:26 PM   #3
Infinite Recursion
Programming Guru
 
Infinite Recursion's Avatar
 
Join Date: Jul 2004
Location: United States
Posts: 3,467
Rep Power: 8 Infinite Recursion is on a distinguished road
Send a message via MSN to Infinite Recursion Send a message via Yahoo to Infinite Recursion
You could also use CSS.
__________________
http://jasonpowers.net

"There are a thousand hacking at the branches of evil to one who is striking at the root."
Infinite Recursion is offline   Reply With Quote
Old Oct 12th, 2004, 8:49 AM   #4
Pizentios
Programming Guru
 
Pizentios's Avatar
 
Join Date: May 2004
Location: Brandon, Manitoba, Canada
Posts: 2,023
Rep Power: 7 Pizentios is on a distinguished road
Send a message via ICQ to Pizentios Send a message via MSN to Pizentios
CSS would probally be the best way to go, since browsers suppor t that better than most html commands these days.
__________________
Profanity is the one language that all programmers understand.

Check out my Blog <---updated Nov 30 2007!
Pizentios is offline   Reply With Quote
Old Oct 12th, 2004, 9:50 AM   #5
emdiesse
Programmer
 
Join Date: Jul 2004
Location: Hampshire
Posts: 56
Rep Power: 5 emdiesse is on a distinguished road
How would you do it in CSS?
emdiesse is offline   Reply With Quote
Old Oct 12th, 2004, 10:26 AM   #6
Pizentios
Programming Guru
 
Pizentios's Avatar
 
Join Date: May 2004
Location: Brandon, Manitoba, Canada
Posts: 2,023
Rep Power: 7 Pizentios is on a distinguished road
Send a message via ICQ to Pizentios Send a message via MSN to Pizentios
Here's some code that you can use to do it inline. Otherwise you'll have to create a class for it.

<img style="filter:alpha(opacity=100)" src="YOUR IMAGE HERE">

Just change the 100 to what ever you want. 50 for 50% etc. I doesn't work in my Firefox, but i have read a few pages that suggest there a setting to allow this kind of code to ruyn under firefox...somthing to do with cashing. I guess it's really not that different to what dnathe4th posted but what ever. I found this answer by searching google. Here is the link to the artical i read:

Link
__________________
Profanity is the one language that all programmers understand.

Check out my Blog <---updated Nov 30 2007!
Pizentios is offline   Reply With Quote
Old Oct 13th, 2004, 12:36 AM   #7
rijiru-chan
Programmer
 
rijiru-chan's Avatar
 
Join Date: Sep 2004
Posts: 78
Rep Power: 5 rijiru-chan is on a distinguished road
how do you do it in javascript?
__________________
There's a lot to find out...on your own.
rijiru-chan is offline   Reply With Quote
Old Oct 13th, 2004, 11:04 AM   #8
Ooble
I eat cake for breakfast.
 
Ooble's Avatar
 
Join Date: Jul 2004
Location: In my box.
Posts: 4,434
Rep Power: 9 Ooble is on a distinguished road
You simply give the image an ID:
<img src="blah" id="Image1" />

Then in the JavaScript tags/file, use:
document.getElementById("Image1").style.opacity = blah%;
document.getElementById("Image1").style.MozOpacity = blah%;
document.getElementById("Image1").style.filter = alpha(opacity = blah);
__________________
Me :: You :: Them
Ooble is offline   Reply With Quote
Old Oct 14th, 2004, 8:10 PM   #9
dnathe4th
Programmer
 
Join Date: Oct 2004
Posts: 32
Rep Power: 0 dnathe4th is on a distinguished road
lolx i love how everyone repeats my answer!!
Anyways, ya, just do it inline, or if its for a number of images, use CSS, just remember, it doesnt show up on all browsers the same way it does on yours!
__________________
&lt;CENTER&gt;<span style='font-size:17pt;line-height:100%'>My Homepage</span>&lt;/CENTER&gt;
dnathe4th is offline   Reply With Quote
Reply

Bookmarks

« Previous Thread in Forum | Next Thread in Forum »

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump




DaniWeb IT Discussion Community
All times are GMT -5. The time now is 1:54 AM.

Powered by vBulletin® Version 3.7.0, Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
Copyright ©2007 DaniWeb® LLC