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

WebArtz - The Web Design Forum » Web Designing & Coding » HTML (Hyper Text Markup Language) » Mouse over the image

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

1Mouse over the image Empty Mouse over the image Mon Aug 09, 2010 9:08 pm

Matti

Matti
Registered Member
Registered Member
Hey guys, can some one give me the code for the Mouse over the images:

http://csshelp.forumotion.net/

2Mouse over the image Empty Re: Mouse over the image Mon Aug 09, 2010 9:18 pm

ankillien

ankillien
Administrator
Administrator
Hi Monk Very Happy

You can use this CSS code to apply effect on hover over an image...

Code:
img:hover {
    //your code here
}

3Mouse over the image Empty Re: Mouse over the image Mon Aug 09, 2010 9:44 pm

Matti

Matti
Registered Member
Registered Member
If you mean to put that in CSS, No I don't want for that I want like here at WebArtz.

Spoiler:

http://csshelp.forumotion.net/

4Mouse over the image Empty Re: Mouse over the image Mon Aug 09, 2010 10:18 pm

ankillien

ankillien
Administrator
Administrator
The above code will do the same. Here is the full code...

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

5Mouse over the image Empty Re: Mouse over the image Mon Aug 09, 2010 11:02 pm

Matti

Matti
Registered Member
Registered Member
But i don't see where to put the image and how.

like this https://i.servimg.com/u/f34/15/04/48/59/banner12.png

or Mouse over the image Banner12

Sorry if am asking to much. Embarassed

http://csshelp.forumotion.net/

6Mouse over the image Empty Re: Mouse over the image Tue Aug 10, 2010 12:17 am

ankillien

ankillien
Administrator
Administrator
Add this HTML wherever you want the image to show up (homepage message, widget or post)...

Code:
<img class="webartz_img" src="http://i34.servimg.com/u/f34/15/04/48/59/banner12.png">

And add this to your CSS...

Code:
img.webartz_img {
-moz-opacity : 0.5;
filter : alpha(opacity=50);
opacity : 0.5;
}
img.webartz_img:hover {
-moz-opacity : 1;
filter : alpha(opacity=100);
opacity : 1;
}

Hope it helps Very Happy

7Mouse over the image Empty Re: Mouse over the image Tue Aug 10, 2010 12:44 am

Matti

Matti
Registered Member
Registered Member
Yep Very Happy that helped so you can lock this now Smile Thanks again.

http://csshelp.forumotion.net/

8Mouse over the image Empty Re: Mouse over the image Tue Aug 10, 2010 11:04 am

Jophy

Jophy
Registered Member
Registered Member
Solved => Topic Locked

http://www.socialtechforum.com/

Sponsored content


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

WebArtz - The Web Design Forum » Web Designing & Coding » HTML (Hyper Text Markup Language) » Mouse over the image

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