html - focus on one element boxshadow on another -


i trying box shadow on element wrapped around input when input in focus. can't work. have structured code wrong. snippet bellow

.cam-peoplepicker-userlookup {    margin-right: 55em;    height: 7em;    min-width: 50%;    overflow: hidden;    border: 1px solid #99b0c1;    padding: 2px 5px 2px 5px;    background-color: white;    -moz-border-radius: 0.5em;    -webkit-border-radius: 0.5em;    border-radius: 0.5em;  }    #k:focus #divadministrators {    border-color: #66afe9;    outline: 0;    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);  }
@*project manager*@  <div class="form-group">    <div id="divadministrators" class="cam-peoplepicker-userlookup ms-fullwidth">      <span id="spanadministrators"></span>      <textarea id="k"></textarea>    </div>    <div id="divadministratorssearch" class="cam-peoplepicker-usersearch ms-emphasisborder"></div>    </div>  </div>

thank all suggestions. appreciate it!!!

although not using jquery, if use jquery may helpful...

$(document).ready(function() {      $('#k').focus(function(event) {          $('#divadministrators').addclass('focused')      });      $('#k').blur(function(event) {          $('#divadministrators').removeclass('focused')      });  });
.cam-peoplepicker-userlookup { margin-right: 55em; height: 7em; min-width: 50%; overflow: hidden; border: 1px solid #99b0c1; padding: 2px 5px 2px 5px; background-color: white; -moz-border-radius: 0.5em; -webkit-border-radius: 0.5em; border-radius: 0.5em; }  .focused { border-color: #66afe9; outline: 0; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6); box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6); }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <div class="form-group">  	<div id="divadministrators" class="cam-peoplepicker-userlookup ms-fullwidth">  		<span id="spanadministrators"></span>  		<textarea id="k"></textarea>  	</div>  	<div id="divadministratorssearch" class="cam-peoplepicker-usersearch ms-emphasisborder"></div>  </div>

i think may not possible until not using js.


Comments

Popular posts from this blog

node.js - Node js - Trying to send POST request, but it is not loading javascript content -

javascript - Replicate keyboard event with html button -

javascript - Web audio api 5.1 surround example not working in firefox -