鼠标悬停图片增加边框效果（适用多种尺寸图片且保持图片不位移）

<div class="con">
		<img src="http://www.zjgsq.com/wp-content/uploads/2014/08/jqueryapi.jpg" width="360px" height="110px">
		<div class="border"></div>
	</div>

.con {
			margin: 50px;
			position: relative;
		}
		.border {
			position: absolute;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
		}
		.con:hover .border {
			border: 5px solid #000;
		}

$(function () {
			var w = $('img').width();
			var h = $('img').height();
			$('.con').width(w);//设置图片外部包裹层的宽度，也可以直接在CSS里设置
			$('.con').height(h);//设置图片外部包裹层的高度，也可以直接在CSS里设置
			$('.border').width(w - 10);//设置边框层宽度，这里要减去border宽度并乘以2
			$('.border').height(h - 10);//设置边框层高度，这里要减去border宽度并乘以2
		});