html - CSS: Hover on 3 stacked images -


i'm trying build photo gallery stacked photos each album. when hover album want 1 image rotate 20 left, 1 rotate 20 right see bits of 3 images @ same time.

i think problem hover signals stuck on topmost image in stacks. i'll post have tried below. ideas? possible?

<!doctype html> <head> <title>just-css: rotate stacked images on hover</title> <style> body {     background-color: black;     color: white;     padding: 20px;     } ul {     margin: 0;     padding: 0;     } ul li {     list-style: none;     position: absolute;     }  img { -webkit-transition: 0.2s; } img:hover.green {-webkit-transform: rotate(-20deg);} img:hover.blue {-webkit-transform: rotate(20deg);}  img { border: 4px solid white; } img.red { background-color: red; } img.green { background-color: green; } img.blue { background-color: blue; } </style> </head> <body> <ul class="img-stack">     <li><img class="red" width="100" height="100" src=""></li>     <li><img class="green" width="100" height="100" src=""></li>     <li><img class="blue" width="100" height="100" src=""></li> </ul> </body> </html>

i know can javascript i'm playing css please no javascript :)

just change this:

img:hover.green {-webkit-transform: rotate(-20deg);} img:hover.blue {-webkit-transform: rotate(20deg);}

to this:

ul:hover img.green {-webkit-transform: rotate(-20deg);} ul:hover img.blue {-webkit-transform: rotate(20deg);}

because can activate 1 :hover selector @ time (as far i'm aware), capture hover on parent element.


Comments

Post a Comment

Popular posts from this blog

c# - SharpSVN - How to get the previous revision? -

i trying find efficient way previous revision of file text comparison using sharpsvn. using (svnclient c = new svnclient()) { c.authentication.defaultcredentials = new networkcredential( configurationmanager.appsettings.get("svnserviceusername") , configurationmanager.appsettings.get("svnservicepassword") , configurationmanager.appsettings.get("svnservicedomain") ); c.authentication.sslservertrusthandlers += new eventhandler<svnsslservertrusteventargs>(authentication_sslservertrusthandlers); collection<svnfileversioneventargs> fileversioncollection = new collection<svnfileversioneventargs>(); svnrevisionrange range = new svnrevisionrange(0, this.hooks.revision); svnfileversionsargs args = new svnfileversionsargs(); args.retrieveproperties = true; args.range = range; foreach (svnchangeitem item in log.changedpaths) { string path = this.repositorypath + it...
Read more

c++ - Is it possible to compile a VST on linux? -

for class project i'm attempting write vst plugin backed cuda. current cuda workflow on linux box, i'd prefer compile , link there. according wikipedia , should possible (i couldn't find steinberg documentation relevant linux) can't find makefile or instructions on how build if aren't using xcode or visual studio. i'm vst 3 sdk doesn't support linux. when try compile plugin under linux, error: ./base/source/fatomic.cpp:39:30: fatal error: libkern/osatomic.h: no such file or directory this issue caused following code in "vst3 sdk/base/source/fatomic.cpp" #if mac #include <libkern/osatomic.h> #if mac_os_x_version_min_required > mac_os_x_version_10_4 #define native_atomic_type (volatile int32_t*) #else #define native_atomic_type (int32_t*) #endif #elif windows #include <windows.h> #endif but hope compiling under linux work vst sdk 2.4. reading. jvstwrapper seems run on lin...
Read more

url - Querystring manipulation of email Address in PHP -

i using third party application (email2http) send me emailid, body , message. unable retrieve email id due name appended on , enclosed < , >. here querystring getting. test.php?from=ajay+reddy &subject=cx&body=somebody when print variable in php returns name , not email id. $from = $_get['from']; echo $from; //output ajay reddy please suggest me how can emailid also. i dont want use post method due testing , debugging. it's working fine. forgot use htmlentities() in debugging.
Read more