Victor
Victor

Reputation: 714

Change Text Color According to Image

I'm trying to figure out a way to change the color of some text via jQuery.

Essentially, I have a div with a random loading image. Over that I have div containing some text.

What I would like to happen is when a specific image is loaded it swaps the text color from white to black.

Anyone point me in the right direction?

For clarification:

My question is how do I find which image has been loaded into a div then execute a function based on thet result. For example:

I have 2 image, which are randomly loaded into a via backstretch.js. I also have another div with some text overlaid on-top of the image:

<!-- my images -->
image-1.jpg
image-2.jpg

<!-- Layout -->
<div id="imageDIV"></div>
<div id="textDiv"><p>hello</p></div>

Once page has loaded and an image has been loaded into the div. Check which one it is then do somthing. So

if { 
   image is image-1.jpg then add a class to #textDiv
}

else if { 
   image is image-2.jpg add this class instead
}

Thanks

Upvotes: 2

Views: 2690

Answers (1)

unfamous
unfamous

Reputation: 46

you can use color-thief to get the dominant color of the image

    myImage = $('#myImage');  
    dominantColor = getDominantColor(myImage);  
    paletteArray = createPalette(myImage, 10); // 2nd argument sets th`e # of colors in palette 

Upvotes: 3

Related Questions