change logo color

[DrBlack]

good morning
i use smf  :2.0.8

i want to change my logo color when refer with the mouse to it ( when point with the mouse to the logo ) its color changes.

for more explain see like this site http://www.ivmp.argonathrpg.net/apt/index.php?wwwRedirect

also, the boards name.

how to make it please ?

[ARG01]

The example is simply using two separate images. One for the logo and one for the logo hover.

Example;

Code Select Expand

#logo a {
float: left;
display: block;
width: 350px;
height: 110px;
background: url(../images/custom/logo_one.png) no-repeat;
}

Code Select Expand

#logo a:hover {
float: left;
display: block;
width: 350px;
height: 110px;
background: url(../images/custom/logo_two.png) no-repeat;
}

A sprite image can also be used.

[DrBlack]

The example is simply using two separate images. One for the logo and one for the logo hover.

Example;

Code Select Expand

#logo a {
float: left;
display: block;
width: 350px;
height: 110px;
background: url(../images/custom/logo_one.png) no-repeat;
}

Code Select Expand

#logo a:hover {
float: left;
display: block;
width: 350px;
height: 110px;
background: url(../images/custom/logo_two.png) no-repeat;
}

A sprite image can also be used.

i dont understand well..

can you explain to me where to add this codes. + where to add the 2 images..

thank you

[ARG01]

This is what I came up with for someone else using one image. Look at the css code and attached image and I am sure that you can figure it out. 

Code Select Expand

#logo { display: block; float: left; width: 371px; height: 130px; background: url(../images/custom/logo.png) 0 0 no-repeat;}
#logo:hover { background-position: 0 -134px;}

Logo code should be located in index.css.

[DrBlack]

thank you very much 

it works..

but i want to ask how to do it. at boards name.

although to make the change color slow..

i hope you understand me

thank you

[ARG01]

Find

Code Select Expand

a:hover

which is normally near the top of index.css and add a color and transition effect. You can alter the 0.3s for faster or slower effect. 

Example;

Code Select Expand

a:hover {
color: #ff0000;  cursor: pointer; transition-duration: 0.3s;
}

Note: This will effect many other link hovers. If you only want board titles then I will have to look into it further as I am not at my own computer right now.

[tim666]

You can use Photoshop if you want, especially if coding is not your thing. Just create the hover effect and export the CSS code. It is much easier, especially if you are not a programmer.

[Streamlife]

Greattings.

I Want to utilize this post To Ask someting about it too..

The Question is.. Can't Found Into the Index.css The #logo a {  or any other Chain with Logo Reffer In the only place i have My logo Set is Under  index.template.php   and i need change my logo too , i mean i want to make one Hover logo But no idea where put this,,

Code Select Expand

#logo a:hover {
float: left;
display: block;
width: 350px;
height: 110px;
background: url(../images/custom/logo_two.png) no-repeat;
}

i already have one Logo on my site and like i say the chain is within index_template.php   

This one

Code Select Expand

</div>
                   <div id="logo">
                      <h1 class="forumtitle">
<a href="', $scripturl, '">', empty($context['header_logo_url_html_safe']) ? '<img src="' . $settings['images_url'] . '/theme/logo.png" alt="' . $context['forum_name'] . '" />' : '<img src="' . $context['header_logo_url_html_safe'] . '" alt="' . $context['forum_name'] . '" />', '</a>
    </h1>
                   
                </div>


The only Refer to logo Into my index.css is this one

Code Select Expand

#main_content_section {
}
h1.forumtitle {
    font-family: Geneva,verdana,sans-serif;
    font-size: 1.8em;
    line-height: 45px;
    margin: 0;
    padding: 0;
}
#siteslogan, img#smflogo {
    float: right;
    line-height: 3em;
    margin: 0;
    padding: 0;
}
h3, h4 {
    padding-bottom: 3px;
}
img#smflogo {
    margin-left: 1em;


So, What can i do? to set one logo hover


My Theme: Red Clique
My site: www.Vskgaming.com.ar/foro

Thanks in Advance.

[ARG01]

My Theme: Red Clique

I suggest that you consult the theme designer. 

[Streamlife]

My Theme: Red Clique

I suggest that you consult the theme designer. 

hello back, Nope, is not a option The Autor from Red clique is OFF since long long long Time...

how hard can be do this in any theme? i mean is a Css Configuration right?