![]() |
|
![]() |
|
|
Thread Tools | Display Modes |
|
|
#1 |
|
Programmer
Join Date: Jul 2004
Location: Hampshire
Posts: 56
Rep Power: 5
![]() |
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? |
|
|
|
|
|
#2 |
|
Programmer
Join Date: Oct 2004
Posts: 32
Rep Power: 0
![]() |
<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
__________________
<CENTER><span style='font-size:17pt;line-height:100%'>My Homepage</span></CENTER> |
|
|
|
|
|
#3 |
|
Programming Guru
![]() ![]() ![]() |
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." |
|
|
|
|
|
#4 |
|
Programming Guru
![]() ![]() |
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! |
|
|
|
|
|
#5 |
|
Programmer
Join Date: Jul 2004
Location: Hampshire
Posts: 56
Rep Power: 5
![]() |
How would you do it in CSS?
|
|
|
|
|
|
#6 |
|
Programming Guru
![]() ![]() |
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! |
|
|
|
|
|
#7 |
|
Programmer
Join Date: Sep 2004
Posts: 78
Rep Power: 5
![]() |
how do you do it in javascript?
__________________
There's a lot to find out...on your own. |
|
|
|
|
|
#8 |
|
I eat cake for breakfast.
![]() ![]() ![]() ![]() Join Date: Jul 2004
Location: In my box.
Posts: 4,434
Rep Power: 9
![]() |
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); |
|
|
|
|
|
#9 |
|
Programmer
Join Date: Oct 2004
Posts: 32
Rep Power: 0
![]() |
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!
__________________
<CENTER><span style='font-size:17pt;line-height:100%'>My Homepage</span></CENTER> |
|
|
|
![]() |
| Bookmarks |
| Currently Active Users Viewing This Thread: 1 (0 members and 1 guests) | |
| Thread Tools | |
| Display Modes | |
|
|