<style>
p.hid {
background-color:#C1D3FB;
position:absolute;
display:none;
border:1px solid blue;
padding:4px 7px;
}
div[id^="bigpick"] {
position:absolute;
opacity:0;
}
img[name="smallimg"]{
opacity:0.6
}
</style>
<script type="text/javascript">
function setBigImage(a) {
var id = a.id;
var arr = a.getAttribute('data').split(',');
var Parr = document.getElementById(arr[0]).parentNode.getElementsByTagName('p');
for(var i=0; i<Parr.length;i++){
if(Parr[i])Parr[i].style.display='none';
}
document.getElementById(arr[0]).style.display='block';
var v=document.getElementById(arr[1]);
v.innerHTML = v.innerHTML.replace(/#bigpick[^\s]+/img,arr[2]).replace(/#img[^\s]+/img,'#'+id);
}
function First() {
document.getElementById("img1").click(); //При загрузке стр. кликаем первый
}
</script>
<img id="img1" name="smallimg" src="http://javascript.ru/forum/images/smilies/smile.gif" height="60px" data="p1,style,#bigpick1" onclick="setBigImage(this)" />
<img id="img2" name="smallimg" src="http://javascript.ru/forum/images/smilies/smile.gif" height="60px" data="p2,style,#bigpick1" onclick="setBigImage(this)" />
<img id="img3" name="smallimg" src="http://javascript.ru/forum/images/smilies/write.gif" height="60px" data="p3,style,#bigpick2" onclick="setBigImage(this)" />
<style id="style">
#bigpickNN {
text-align:center;
opacity:1;
filter: alpha(opacity=1);
-webkit-transition:1s;
-moz-transition:1s;
-ms-transition:1s;
-o-transition:1s;
transition:1s;
}
/*Cтиль кликанутого превью*/
#imgNN {
opacity:1.0;
border:blue dashed 1px;
}
</style>
<div id="bigpick1">
<img id = 'bigimg' src = "http://javascript.ru/forum/images/smilies/smile.gif" height="390px" alt="" onload="First()"/><br />
<div id="commentary">
<p class="hid" id="p1">ЗДЕСЬ НУЖНЫЙ ТЕКСТ 1 11111</p>
<p class="hid" id="p2">ЗДЕСЬ НУЖНЫЙ ТЕКСТ 2 2222</p>
</div>
</div>
<div id="bigpick2">
<img id = 'bigimg' src = "http://javascript.ru/forum/images/smilies/write.gif" height="390px" alt="" /><br />
<div id="commentary">
<p class="hid" id="p3">ЗДЕСЬ НУЖНЫЙ ТЕКСТ3 3333</p>
</div>
</div>
p2,style,#bigpick1 name=