Welcome, Guest. Please login or register.

ShoutBox!

Scrubmeister

2022 Dec 30 07:11:16
Feel better soon Ken
 

Skhilled

2022 Dec 26 22:55:32
No problemo! I've been busy working on a theme. Real life comes first. :) I wish I could stay in bed a few days. LOL
 

Ken

2022 Dec 26 14:04:15
Sorry that I've not been keeping up, these past few days have been rough, been spending most of my days in bed.  :o
 

Ken

2022 Dec 26 14:02:25
Happy Holidays and Merry Christmas and Happy New Years to everyone!!!
 

Skhilled

2022 Dec 24 16:51:25
Happy Holidays and Happy New Year!  :)

I've always been on the naughty list! LOL He won't be stopping here either but I've got plenty of food, beer and rum. LOL

Scrubmeister

2022 Dec 24 12:02:13
Wish everyone Happy Holidays and a great New Year :) Not sure Santa is stopping here this year? I could be border line on the Naughty list.  :-\
 

Ken

2022 Nov 19 13:42:47
 :banana: :banana:
Sounds wonderful! Good luck!
 

Skhilled

2022 Nov 18 22:24:23
The new job is working out great! Everyone is so nice and helpful! I hear they don't like haters, etc. and will fire them.  :laugh:
 

Ken

2022 Nov 07 21:06:02
 :thumbup:
 

Skhilled

2022 Nov 07 20:09:42
And I start a new job tomorrow working in a warehouse close to home. Can walk to it. :)

Recent Topics

TP Articles


Search in titles
Search in article texts

Author Topic: How To Make Things Change Colors Upon Hovering  (Read 2680 times)

0 Members and 1 Guest are viewing this topic.

Offline Skhilled (OP)

  • Administrator
  • *
  • Posts: 7503
  • Gender: Male
  • Once you stop trying to learn, you stop living!
  • View Gallery
    • Buildz Hosting
How To Make Things Change Colors Upon Hovering
« on: August 17, 2019, 09:07:02 AM »
I've found a way to do this in the SMF 2.1 RC2 version but will work in any modern version of SMF.

I found this by accident working on a new theme that uses the ".bg.even/.bg.odd" code in index.css. There's code for alternating colors like in a topic, in the admin, etc. For instance, open any topic with more than one post in it on this forum. You'll notice that the posts alternate between two colors. That part uses the ".bg.even/.bg.odd" code or ".windowbg/.windowbg2" (mostly for SMF 2.0.15).

You can see it in action here on the help, calendar, and member pages:

https://skhilled.com/rc2/index.php?theme=14

What you'll need to do is create a "hover" for the code in question so it changes it to another when you put your mouse over it. ;) The following is code from 2.1 RC2:

Code: [Select]
/* Here comes the glory... */
.windowbg:nth-of-type(even), .bg.even {
background: #1f1f1f;
}
.windowbg:nth-of-type(odd), .bg.odd {
background: #282828;
}

Change it to this:

Code: [Select]
/* Here comes the glory... */
.windowbg:nth-of-type(even), .bg.even {
background: #1f1f1f;
}
.windowbg:nth-of-type(even):hover, .bg.even {
background: #000;
}
.windowbg:nth-of-type(odd), .bg.odd {
background: #282828;
}
.windowbg:nth-of-type(odd):hover, .bg.odd {
background: #000;
}

Just change the background of the following code to whatever you want the hover color to be:

Code: [Select]
background: #000;

Offline Ken

  • Vietnam Era Veteran
  • Administrator
  • *
  • Posts: 10816
  • Gender: Male
  • View Gallery
Re: How To Make Things Change Colors Upon Hovering
« Reply #1 on: August 17, 2019, 11:47:22 AM »
Neat looking trick.  :thumbup:
"Not all who wander are lost."-Tolkien
Yesterday When I was Young.

Offline Skhilled (OP)

  • Administrator
  • *
  • Posts: 7503
  • Gender: Male
  • Once you stop trying to learn, you stop living!
  • View Gallery
    • Buildz Hosting
Re: How To Make Things Change Colors Upon Hovering
« Reply #2 on: August 17, 2019, 12:24:20 PM »
Next I plan on trying to make the boards on the home page do the same.  :wink: