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.
1
- 2do you know what image will be loaded?AMember– AMember2014-02-09 10:26:36 +00:00Commented Feb 9, 2014 at 10:26
Add a comment |
2 Answers
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; } 
Comments
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
2 Comments
Preethi
Hi, i dont know what will be the image that will be loaded
Preethi
I have tried with background check plugin, github.com/kennethcachia/Background-Check I have added the background-check.js file and in css i have mentioned, a.background--dark { color: white; } a.background--complex { color: gray; } But it doesn't work