WebArtz - The Web Design Forum
Welcome to WebArtz, Guest!

WebArtz is a nice place for discussions related to web designing and coding. We help our members to code their own website templates with HTML and CSS. We give them advice on various issues.

To know more about WebArtz Forum, visit the About Us page.

At the moment, you are viewing the forum as a guest. As a guest you can't make post and participate in discussions. You need to register and become a member of the forum. Click the register link below and become a part of this forum.

Thank You

WebArtz - The Web Design Forum
Welcome to WebArtz, Guest!

WebArtz is a nice place for discussions related to web designing and coding. We help our members to code their own website templates with HTML and CSS. We give them advice on various issues.

To know more about WebArtz Forum, visit the About Us page.

At the moment, you are viewing the forum as a guest. As a guest you can't make post and participate in discussions. You need to register and become a member of the forum. Click the register link below and become a part of this forum.

Thank You


You are not connected. Please login or register

View previous topic View next topic Go down  Message [Page 1 of 1]

1Transparent image? Empty Transparent image? Fri Dec 25, 2009 10:10 pm

karna

karna
Registered Member
Registered Member
mmmm...I wanted to know if it is possible.
I want to make an image transparent with CSS. I don't want to edit all images in photoshop tongue

Please tell me if there is a way Very Happy
Thanks you

2Transparent image? Empty Re: Transparent image? Sat Dec 26, 2009 2:06 am

Sanket

Sanket
Administrator
Administrator
You mean make it a little lighter? or just make it like a render?
What is it?

http://www.webartzforum.com

3Transparent image? Empty Re: Transparent image? Sat Dec 26, 2009 9:44 am

karna

karna
Registered Member
Registered Member
Sanket wrote:You mean make it a little lighter? or just make it like a render?
What is it?

I want it to be lighter. actually I have an image which is a link to another page. So it is like this
Code:
<a href="url"><img src="url"></a>

I want the image to be partly transparent when normal and solid (no-transparency) when mouse hover. Does it make sense. Please tell me if it possible Very Happy
I had seen it on some website but not sure if they had done it with css or javascript Neutral

4Transparent image? Empty Re: Transparent image? Sat Dec 26, 2009 11:56 am

Sanket

Sanket
Administrator
Administrator
Code:
<a href="http://hitskin.com"><img src="http://webartz.forumotion.com/users/3111/11/99/51/avatars/3-38.png" style="opacity:1;filter:alpha(opacity=100)"
onmouseover="this.style.opacity=0.4;this.filters.alpha.opacity=40"
onmouseout="this.style.opacity=1;this.filters.alpha.opacity=100" border = "none"/></a>
Use this code & see if that works for you.

http://www.webartzforum.com

5Transparent image? Empty Re: Transparent image? Sat Dec 26, 2009 12:02 pm

ankillien

ankillien
Administrator
Administrator
Well, sanket has already given a solution. But if you want to add code to your external Stylesheet. Use this code...

Code:
a img {
opacity : 0.5;
filter : alpha(opacity=50);
}
a:hover img {
opacity : 1;
filter : alpha(opacity=100);
}

6Transparent image? Empty Re: Transparent image? Wed Dec 30, 2009 9:40 am

karna

karna
Registered Member
Registered Member
Yes, thats I needed.
Thank you sanket and anki Very Happy

I love this forum Razz

7Transparent image? Empty Re: Transparent image? Wed Dec 30, 2009 11:43 am

ankillien

ankillien
Administrator
Administrator
No problem dude Wink

Locked

Sponsored content


View previous topic View next topic Back to top  Message [Page 1 of 1]

Permissions in this forum:
You cannot reply to topics in this forum