kennethcachia / background-check

Automatically switch to a darker or a lighter version of an element depending on the brightness of images behind it.
http://kennethcachia.com/background-check/
MIT License
3.27k stars 282 forks source link

Background image divs #6

Closed JonathanMatthey closed 10 years ago

JonathanMatthey commented 10 years ago

Added support for targets to work when on top of other divs that have background images, not just images.

coded it in order to solve this issue for http://www.jonathanmatthey.com/project/2013/07/01/nike-id-prototyping.html where the arrows left and right hover over the black hero image

xposedbones commented 10 years ago

I can't make it work. this is my structure

<div class="slide_item" style="background-image:url(<?php echo $img ?>);">
    <div class="wrap980">
        <div class="slide__content">
            <div>
                <h2><?php echo $slide['title'] ?></h2>
                <?php echo $slide['text'] ?>
            </div>
        </div>
     </div>
</div>
nathan-charrois commented 10 years ago

Also cant get it to work. This is needed so much!

Appreciate your efforts

xposedbones commented 10 years ago

also, I checked your code and instead of targeting only div element, you should target everything that is not an image

kennethcachia commented 10 years ago

I'm currently working on a new version that includes proper support for css background images. Should be released soon!

JonathanMatthey commented 10 years ago

guys...

it does work:

demo: http://jonathanmatthey.com/Background-Check/examples/background-images.html

screenshot of it working: http://jonathanmatthey.com/Background-Check/ss.jpg

On 15 October 2013 15:30, Kenneth notifications@github.com wrote:

I'm currently working on a new version that includes proper support for css background images. Should be released soon!

— Reply to this email directly or view it on GitHubhttps://github.com/kennethcachia/Background-Check/pull/6#issuecomment-26364806 .

kennethcachia commented 10 years ago

Refer to #3 for more info on css background images.