Need CSS help. A problem with hover color...
Jun 5, 2019 18:39:02 #
I still don't know why your way doesn't work but this does:
<div id="main">
<SPAN STYLE="font-size:20px;cursor:pointer; color:#006600;" ONCLICK="openNav()"
onmouseover="menucolor('red')" onmouseout="menucolor('green')">
<CENTER id="menuspan" >☰ Menu</CENTER>
</SPAN>
<script>
//Change the "☰ MENU" colors
function menucolor(clr)
{
document.getElementById('menuspan').style.color = clr;
}
function openNav() {
document.getElementById("mySidenav").style.width = "230px"; /* Width of menu window */
document.getElementById("main").style.marginLeft = "0px"; /* zero doesn't move the link, otherwise the link moves x pixels */
}
function closeNav() {
document.getElementById("mySidenav").style.width = "0";
document.getElementById("main").style.marginLeft= "0";
}
</script>
</DIV>
<div id="main">
<SPAN STYLE="font-size:20px;cursor:pointer; color:#006600;" ONCLICK="openNav()"
onmouseover="menucolor('red')" onmouseout="menucolor('green')">
<CENTER id="menuspan" >☰ Menu</CENTER>
</SPAN>
<script>
//Change the "☰ MENU" colors
function menucolor(clr)
{
document.getElementById('menuspan').style.color = clr;
}
function openNav() {
document.getElementById("mySidenav").style.width = "230px"; /* Width of menu window */
document.getElementById("main").style.marginLeft = "0px"; /* zero doesn't move the link, otherwise the link moves x pixels */
}
function closeNav() {
document.getElementById("mySidenav").style.width = "0";
document.getElementById("main").style.marginLeft= "0";
}
</script>
</DIV>
Jun 5, 2019 18:46:01 #
edrobinsonjr-
I thought I copied everything correctly, but it's still green. With or without the space after menuspan for SPAN id="menuspan "...
https://cvrhs.com/indexTEST.html
Thanks so much for trying. Like I said, not catastrophic though. I can live with the green, but I thought it SHOULD be simple????
W3Schools "try-it" editor yields the same results.
I thought I copied everything correctly, but it's still green. With or without the space after menuspan for SPAN id="menuspan "...
https://cvrhs.com/indexTEST.html
Thanks so much for trying. Like I said, not catastrophic though. I can live with the green, but I thought it SHOULD be simple????
W3Schools "try-it" editor yields the same results.
Jun 5, 2019 19:08:47 #
Then I tried something really simple...
I put this after your body style before .sidenav: #menuspan:hover{color: red;}
I added an id to the center tag containing "☰ Menu."
<CENTER id="menuspan" >☰ Menu</CENTER>
It works! However, if I put that style before the body style it doesn't work. CSS can be strange at times.
My previous fix had a couple of typos in it. Sorry.
I put this after your body style before .sidenav: #menuspan:hover{color: red;}
I added an id to the center tag containing "☰ Menu."
<CENTER id="menuspan" >☰ Menu</CENTER>
It works! However, if I put that style before the body style it doesn't work. CSS can be strange at times.
My previous fix had a couple of typos in it. Sorry.
Jun 5, 2019 19:10:17 #
Jun 5, 2019 19:49:11 #
edrobinsonjr wrote:
Sorry... I just sent you a different, SIMPLE fix. Let me know.
Ed
Ed
Hallelujah!!!!!!!
Check the indexTEST page!
THANK YOU ED, THANK YOU!
I believe the code fits in the two include files (Style & Body), so I don't have to change 50+ pages.
I had to put the "menu" span in a table as it was hot for the entire line (width of window), not just the text.
(Wish I knew CSS better! I gave up on Java.
)Jun 5, 2019 19:49:55 #
been there, done that. Correct your photos and then send them to Costco. If you've done you're part, they will do their part.
Jun 5, 2019 20:35:15 #
shelty wrote:
been there, done that. Correct your photos and then send them to Costco. If you've done you're part, they will do their part.
Possibly the wrong thread?
Jun 5, 2019 21:02:43 #
You're very welcome. I did a lot of web work before I retired and I seem to have lost a lot of it. It was a pleasure to get a chance to help out.
Ed
Ed
Jun 5, 2019 21:08:21 #
edrobinsonjr wrote:
You're very welcome. I did a lot of web work before I retired and I seem to have lost a lot of it. It was a pleasure to get a chance to help out.
Ed
Ed
(Yea, it leaks out.....)
Jun 6, 2019 12:16:12 #
Anhanga Brasil
Loc: Cabo Frio - Brazil
Longshadow wrote:
The menu list items do change, I'm trying to get the menu link in the center of the page that opens the menu to change to red on hover. It remains green.
(I'm using Firefox.)
(I'm using Firefox.)
It works fine for me. I use Opera and when I pass the mouse over it turns to red.
Working just fine.
Jun 6, 2019 14:03:58 #
Anhanga Brasil wrote:
It works fine for me. I use Opera and when I pass the mouse over it turns to red.
Working just fine.
Working just fine.
Yes, it's now working. Ed Robinson was kind enough to provide a fix for me.
Jun 7, 2019 13:27:36 #
Anhanga Brasil
Loc: Cabo Frio - Brazil
Longshadow wrote:
Yes, it's now working. Ed Robinson was kind enough to provide a fix for me.
I noticed. Now. Kudos.
Jun 7, 2019 14:00:08 #
Anhanga Brasil wrote:
I noticed. Now. Kudos.
Definitely kudos to Ed!
Jun 7, 2019 14:18:23 #
Anhanga Brasil
Loc: Cabo Frio - Brazil
Longshadow wrote:
Definitely kudos to Ed!
To both of you. I know it is a PITA to go through hundreds
of lines in order to find a possible sintax error or variables definitions.
I used to program in Assembly, and don't get me started.
"Oh, no more ! Oh, never more !".
Jun 7, 2019 14:41:10 #
Yes, assembler was definitely a pain but it was also the most efficient use of the machine short of binary.
I have always enjoyed writing code but it wa always somewhat disconcerting to spend a month writing a program and having the machine run it to completion in less than a second.
Ed
I have always enjoyed writing code but it wa always somewhat disconcerting to spend a month writing a program and having the machine run it to completion in less than a second.
Ed
If you want to reply, then register here. Registration is free and your account is created instantly, so you can post right away.