изображение в тексте новости с увеличением

Нажмите на изображение для просмотра в полном размере

давно хотел сделать скрипт чтобы на странице материала с новостями картинка была слева а текст справа, после чего становился во всю ширину страницы под картинкой
Установка:
На странице материала и комментариев к нему новостей сайта заменяем основной код вывода текста на:

Код

<div class="attribute-image">
<div class="imageleft">
<div class="noimage1">
<?if($IMG_URL1$)?><img id="img$ID$" src="$IMG_URL1$" width="150px" align="left" alt="$ENTRY_NAME$"/><?else?><?endif?>
<script type="text/javascript">
  $(function(){
  $('#img$ID$').click(function(){var s="'sc'";
  new _uWnd('Et','Реальный размер изображения $ENTRY_NAME$',70,70,{autosize:1,shadow:1,autosizeonimages:1,header:1},'<img src="'+$(this).attr('src')+'" align="center" alt="" onclick="_uWnd.close('+s+')" style="max-width:900px;max-height:700px;cursor:pointer;">');});
  });
</script>
</div>
</div>
</div>
<div class="attribute-long">$MESSAGE$ <?if($ATTACHMENTS$)?><div style="text-align:left;" class="eAttach">Прикрепления: $ATTACHMENTS$</div><?endif?></div>
<style>div.attribute-image {
margin: 0.25em 0 0.5em 0;
}
div.imageleft {
float: left;
padding: 0 0.5em 0 6;
}
div.attribute-long {
font-size: 100%;padding: 0px 6 10 6;text-align: justify;
}
.noimage1 img {background: none repeat scroll 0 0 #515151;border: 1px solid #515151;border-radius: 3px 3px 3px 3px;margin: 2px;padding: 1px;}
.noimage1 img:hover {background:none repeat scroll 0 0 #FFC500;border: 1px solid #515151;}
</style>

Понравилось: