никрусскимибуквами,
<!DOCTYPE html><html class=''>
<head><meta charset='UTF-8'>
<style class="cp-pen-styles">
body {background:#eaeaea}
.slidebox {position:relative;height: 390px;width: 431px; margin:0 auto;overlow:hidden;}
#fancybox-loading{position:fixed;top:50%;left:50%;width:40px;height:40px;margin-top:-20px;margin-left:-20px;cursor:pointer;overflow:hidden;z-index:1104;display:none;}
#fancybox-loading div{position:absolute;top:0;left:0;width:40px;height:480px;background-image:url('../img-system/fancybox.png');}
#fancybox-overlay{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1100;display:none;}
#fancybox-tmp{padding:0;margin:0;border:0;overflow:auto;display:none;}
#fancybox-wrap{position:absolute;top:0;left:0;padding:20px;z-index:1101;outline:none;display:none;}
#fancybox-outer{position:relative;width:100%;height:100%;background:#fff;}
#fancybox-content{width:0;height:0;padding:0;outline:none;position:relative;overflow:hidden;z-index:1102;border:0 solid #fff;}
#fancybox-hide-sel-frame{position:absolute;top:0;left:0;width:100%;height:100%;background:transparent;z-index:1101;}
#fancybox-close{position:absolute;top:-15px;right:-15px;width:30px;height:30px;background:transparent url('../img-system/fancybox.png') -40px 0;cursor:pointer;z-index:1103;display:none;}
#fancybox-error{color:#444;font:normal 12px/20px Arial;padding:14px;margin:0;}
#fancybox-../img{width:100%;height:100%;padding:0;margin:0;border:none;outline:none;line-height:0;vertical-align:top;}
#fancybox-frame{width:100%;height:100%;border:none;display:block;}#fancybox-left,
#fancybox-right{position:absolute;bottom:0;height:100%;width:35%;cursor:pointer;outline:none;background:transparent url('../img-system/blank.gif');z-index:1102;display:none;}
#fancybox-left{left:0;}
#fancybox-right{right:0;}
#fancybox-left-ico,
#fancybox-right-ico{position:absolute;top:50%;left:-9999px;width:30px;height:30px;margin-top:-15px;cursor:pointer;z-index:1102;display:block;}
#fancybox-left-ico{background-image:url('../img-system/fancybox.png');background-position:-40px -30px;}
#fancybox-right-ico{background-image:url('../img-system/fancybox.png');background-position:-40px -60px;}
#fancybox-left:hover,
#fancybox-right:hover{visibility:visible;}
#fancybox-left:hover span{left:20px;}
#fancybox-right:hover span{left:auto;right:20px;}
.img {position:relative;width:431px;height: 312px; border:1px solid #D4D4D4; overflow: hidden;-webkit-transition: all 0.15s ease-in-out;transition: all 0.15s ease-in-out;}
.img:hover {border: 1px solid #FFF;
-webkit-box-shadow: 0px 0px 30px -12px rgba(0,0,0,1);
-moz-box-shadow: 0px 0px 30px -12px rgba(0,0,0,1);
box-shadow: 0px 0px 30px -12px rgba(0,0,0,1);}
.img img{width:431px;-webkit-transition: all 0.15s ease-in-out;transition: all 0.15s ease-in-out;}
.img img:hover{-webkit-transform:scale(1.05,1.05);transform:scale(1.05,1.05);}
.it img {width:70px;border-radius: 2px; float:left;border: 1px solid #D4D4D4;margin-right: 7px;margin-top: 7px;-webkit-transition: all 0.15s ease-in-out;transition: all 0.15s ease-in-out;}
.it img:hover {border: 1px solid #FFF; cursor:pointer;-webkit-box-shadow: 0px 0px 30px -12px rgba(0,0,0,1);
-moz-box-shadow: 0px 0px 30px -12px rgba(0,0,0,1);
box-shadow: 0px 0px 30px -12px rgba(0,0,0,1);}
#alt-tx {position:absolute;bottom:10px;width:100%;background:#f4ebdb;height:20px;line-height:20px;padding-left:15px;font: 16px Tahoma; color:#333;border-top:1px solid white;border-bottom:1px solid white;-webkit-transition: all 0.15s ease-in-out;transition: all 0.15s ease-in-out;z-index:999;}
.img:hover #alt-tx {bottom:-30px;}</style>
<script>
window.addEventListener('DOMContentLoaded', function() {
var imgs = document.querySelectorAll('.thumbs img'),
bigImg = document.querySelector('.img img'),
tx = document.querySelector('#alt-tx');
[].forEach.call(imgs, function(img) {
img.addEventListener('click', function() {
bigImg.src = img.src;
bigImg.alt = img.alt;
tx.innerHTML = img.alt;
});
});
});
</script>
</head><body>
<div class="slidebox">
<div class="img">
<a href="http://storage4.static.itmages.ru/i/15/1108/h_1447026901_2768613_70d2d7f24b.png" rel="example_group" id="adpdp14">
<div id="alt-tx">тигр на синем фоне</div>
<img src="http://storage4.static.itmages.ru/i/15/1108/h_1447026901_2768613_70d2d7f24b.png" id="dp14" style="margin-bottom: 3px;" alt="тигр на синем фоне" /></a>
</div>
<div class="thumbs">
<div class="it"><a style="display:none;" href="http://storage4.static.itmages.ru/i/15/1108/h_1447026901_2768613_70d2d7f24b.png" rel="example_group"></a>
<img src="http://storage4.static.itmages.ru/i/15/1108/h_1447026901_2768613_70d2d7f24b.png" alt="тигр на синем фоне" /></div>
<div class="it"><a style="display:none;" href="http://storage4.static.itmages.ru/i/15/1108/h_1447026901_8526342_a9544f81e5.png" rel="example_group"></a>
<img src="http://storage4.static.itmages.ru/i/15/1108/h_1447026901_8526342_a9544f81e5.png" alt="тигр на желтом фоне" /></div>
<div class="it"><a style="display:none;" href="http://storage3.static.itmages.ru/i/15/1108/h_1447026901_4225697_63e5676afd.png" rel="example_group"></a>
<img src="http://storage3.static.itmages.ru/i/15/1108/h_1447026901_4225697_63e5676afd.png" alt="тигр на черном фоне" /></div>
<div class="it"><a style="display:none;" href="http://storage3.static.itmages.ru/i/15/1108/h_1447026901_2299179_16bd4d0d96.png" rel="example_group"></a>
<img src="http://storage3.static.itmages.ru/i/15/1108/h_1447026901_2299179_16bd4d0d96.png" alt="тигр на весь фон" /></div>
<div class="it"><a style="display:none;" href="http://storage3.static.itmages.ru/i/15/1108/h_1447026901_8345667_ef9ad72d59.png" rel="example_group"></a>
<img src="http://storage3.static.itmages.ru/i/15/1108/h_1447026901_8345667_ef9ad72d59.png" alt="тигр и человек" /></div>
</div>
</div>
</body>
</html>
