Is it possible to have another banner when hovering it?

Yes, it is possible to have another banner when hovering it?

Would be cool if there was CSS-code.

Thanks.

Add bouth banners through CSS.

First static banner goes here =>

Code:

#logo-desc {
    background-image: url("STATIC LOGO LINK HERE");
}


Open a new rule =>

Code:

#logo-desc:hover {
    background-image: url("HOVER IMAGE LINK HERE");
}

It works. Unfortunately, it looks like this: http://crimson-butterfly.forumotion.com/

Three logos in one! Any ideas?

After link do a =>

Code:

no-repeat

Like this

Code:

background-image: url("LINK HERE") no-repeat;

Did you remove your logo in admin panel, pictures menagment?

Didn't work. I actually tried with, and without, the picture in Pics management.

I also tried with writing "no-repeat" after:

1. Only the first code. Pics management, disabled.
2. Only the second code. Pics management, disabled.
3. Both codes. Pics management, disabled.

(I also tried all three ways with the picture in Pics management enabled.)

Without the picture in Pics management, you could only see about 10 pixels of the logo.

Enabled, you could see only one logo. But when hovering the "hovering version" appears next to it.

(The logo in the middle is always looking the same.)

Any ideas?

Remove it totally from AP, pictures menagment (delete link and save)=> https://2img.net/r/ihimizer/img825/167/starwarsjediknightacade.png
Banner should display (whole) after you add settings for height etc.

Than:
Copy my settings (all settings, margins, height, width),
2. Put this in CSS =>

Code:

#logo-desc:hover {
    background-image: url('PUT YOUR HOVER LINK HERE');
    height: 256px;
    width: 256px;
}

3. Edit the existing rule, don't make an other one like you did the first time =>

Code:

#logo-desc {
    margin: 0;
    padding: 0;
    text-align: center;
    background-image: url('STATIC BANER LINK HERE');
    height: 256px;
    width: 256px;
}

If it doesn't get in center add margin-left: 250px to both rules (see if nececary).

Thanks. It worked.

I removed everything, and added this code:

Code:

#logo-desc:hover {
    background-image: url(image);
    height: 258px;
    width: 256px;
}

#logo-desc {
    margin: 0;
    padding: 0;
    text-align: center;
    background-image: url(image);
    height: 258px;
    width: 256px;
margin-left: 251px;
}

I changed 250 to 251, so that the logo got the correct width.

I also changed the height, from 256 to 258, so that it got the correct height.



The only thing that ain't working anymore, is the "logo link". Before, when I clicked on the logo, I was linked to the index: http://crimson-butterfly.forumotion.com/

What code do I have to use to get a link out of it?

Thanks.

I don't think it can be done through CSS without HTML and you don't have templates.
But you can try something more simplier, go to picture menagment, add a totally (100%) transparent photo in it (like this but maybe smaller, whatever you want https://i.servimg.com/u/f66/15/66/68/20/blank_10.png ), that third banner will go over your current banners, visualy nothing will change (your banner will still hover) and your banner will become a link. I've tried it, and works.
Do the picture the size you wish, and that will be your ''click space''.

Good idea. It worked. Thanks.

I will mark this thread as "solved".

Since this thread is marked solved, I will lock this thread.


Sanket