jquery - 別の要素がホバーされているときに要素からボックス シャドウ効果を削除するにはどうすればよいですか?

Question

構造：

 <div class="box">
      <div class="inner_box">
      </div>
 </div>

.inner_box にはボックス シャドウ効果があります。.box がホバーされているとき、.inner_box からシャドウ効果を削除したい。JQueryを使用する以外に、できればCSS3でこれを行う別の方法はありますか?

JQueryでこれを行う方法の例も教えてください。ありがとう！

Answer 1

このcssを使用するだけで動作しますDEMO HERE

.box:hover .inner_box {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}