CODEWITHSUNDEEP
jquerycsshtml
Andy
Andy

Reputation: 1432

Hover a DIV, give enclosed DIV a shadow

Here's the setup : http://jsfiddle.net/AndyMP/rVrjY/

What I'd like to achieve is a shadow on the smaller DIV when I hover the larger DIV. Is this possible? Can it be done with CSS or is it a jquery solution, if at all?

Upvotes: 0

Views: 298

Answers (3)

MarcinJuraszek
MarcinJuraszek

Reputation: 125630

I'm not sure what kind of shadow you are looking for, but the idea is simple: use this selector and put your effect inside it to make it working when bigger div is hovered:

    .one:hover .two {
        /* put your css here */
        box-shadow: 2px 2px 5px #888;
    }

Example: http://jsfiddle.net/rVrjY/1/

Upvotes: 2

David Thomas
David Thomas

Reputation: 253328

Of course, just use:

​.one:hover .two {
    box-shadow: 2px 2px 5px #f90;
}​

JS Fiddle demo.

Upvotes: 1

rjz
rjz

Reputation: 16510

Sure, just add a rule like this:

.one:hover .two {
  box-shadow: 3px 3px #f00;   
}

Note that box-shadow may not be supported in older browsers, and the hover event won't work in devices that don't support it....but hopefully this is a starting point to get you where you need to go.

Upvotes: 2

Related Questions