Preethi
Preethi

Reputation: 339

Text color change based on the color of the background image

Can we change the color of the text based on the color of the background image? I have a background image which i have appended it to body. When you reload the page every time the background image gets changed. But i have my menus which are positioned on the image having text color as black. If the background image is black, menus wont be visible. Any solutions for my problem? Thanks in advance.

Upvotes: 0

Views: 206

Answers (2)

AMember
AMember

Reputation: 3057

If you know what will be the image that will be loaded you can create a dictionary with the image name and the css class that will be appended to the text for it. then on page load attach the class to the body classes.

If you dont know the image that will be loaded there are some solutions but they are not complete. look at this answer

Upvotes: 0

scripter
scripter

Reputation: 130

use switch case to handle

switch(backgroundimage){
  case "black.jpg":
    document.body.color = "white";
  break;
  case "white.jpg":
    document.body.color = "black";
  break;
  case "green.jpg":
    document.body.color = "gray";
  break;
}

Upvotes: 4

Related Questions