Question

Здравствуйте, возникла следующая проблема с изображениями в доске объявлений.

На сайт был загружен скрипт:

    /*Start(showImgs)*/ function showImgs(indx){ var bck=indx-1;var nxt=indx+1; if (bck<0){bck=allEntImgs.length-1;} if (nxt>=allEntImgs.length){nxt=0;} var imgs=''; for (var i=0;i<allEntImgs.length;i++){var img=i+1; if(allEntImgs[i][0].length<1){continue;} if (i==indx){imgs+= '<b class="pgSwchA">'+img+'</b> ';} else {imgs += '<a class="pgSwch" href="javascript://" rel="nofollow" onclick="showImgs('+i+');return false;">'+img+'</a> ';} } if (allEntImgs.length>1){imgs = '<a class="pgSwch" href="javascript://" rel="nofollow" onclick="showImgs('+bck+');return false;">&laquo; Назад</a> '+imgs+'<a class="pgSwch" href="javascript://" rel="nofollow" onclick="showImgs('+nxt+');return false;">Вперед &raquo;</a> ';} var hght = parseInt(allEntImgs[indx][2]); if ($.browser.msie) { hght += 28; }; _picsCont = '<div id="_prCont" style="position:relative;width:' + allEntImgs[indx][1] + 'px;height:' + hght.toString() + 'px;"><img alt="" border="0" width="' + allEntImgs[indx][1] + '" height="' + allEntImgs[indx][2] + '" src="' + allEntImgs[indx][0] + '"/><div align="center" style="padding:5px 0 2px 0;">'+imgs+'</div></div>'; new _uWnd('wnd_prv',"Фотографии объекта",10,10,{popup:1,waitimages:300000,autosizewidth:1,hideonresize:1,autosize:1,fadetype:1,align:'center',min:0,max:0,resize:1},_picsCont); } /*End(showImgs)*/ $(document).ready(function(){ /*Start DocumentReady*/ $('td.eMessage .showImgs a:has(img)').click(function(){ showImgs(0);return false; }); /*End DocumentReady*/ }); 

 

в дизайте доски объявления (просмотр объявления и комментариев к ним) протисано следующее

<?if($IMGS_ARRAY_JS$)?>$IMGS_ARRAY_JS$ <?endif?>
<script type="text/javascript">var allEntImgs=allEntImgs$ID$;</script> 
<script type="text/javascript" src="http://alfadom.ucoz.ru/_showImgs.js"></script>

<div id="siteimg$ID$"></div> 
$IMGS_ARRAY_JS$ 
<script> 
var html=''; 
for(i in allEntImgs$ID$) { 
var aImg=allEntImgs$ID$[i]; 
html+=(aImg[3] && aImg[3].length>0 ? '<a href="'+aImg[0]+'" onclick="showImgs('+i+');return false;"> <img border="0" src="'+aImg[3]+'" style="padding:2px;"></a>' : '<img src="'+aImg[0]+'">'); 
} 
document.getElementById('siteimg$ID$').innerHTML=html; 
</script>

 

Все было нормально, несколько лет скрипт работал. Но пару недель назад возникла проблема. все загружаемые фотографии в доске объявлений при просмотре самого объявления имеют громадные размеры, хотя до этого скрипт позволял автоматически выладывать уменьшенные размеры изображений. а при нажатии на изображение оно увеличивалось и его можно было листать. Функция перелистывания изображения осталось, а размер изображений увеличился.

Люди, подскажите что нужно изменить?

А еще лучше подскажите, что нужно прописать, что бы изображения автоматически добавлялось в объялениях без ручной прописи $IMAGE1$ $IMAGE2$ $IMAGE3$ и т.д. и имело маленький размер изображений, а при нажатии пролистывалось как тут http://sutochno.ucoz.ru/board/1_komnatnye_kvartiry_posutochno_v_makhachkale/gor_makhachkala_ul_gagarina_21/1-1-0-3

Answer 1

Чтобы фото выводились автоматически без добавления кодов IMAGE1 и тому подобных, перейдите в шаблон страницы комментариев модуля доска объявлений, далее найдите код $MESSAGE$ сразу же после которого установите условия вида:

<?if($IMG_URL1$)?><a href="$IMG_URL1$" class="ulightbox"><img src="$IMG_SMALL_URL1$" alt="$TITLE$" /></a><?endif?>

<?if($IMG_URL2$)?><a href="$IMG_URL2$" class="ulightbox"><img src="$IMG_SMALL_URL2$" alt="$TITLE$" /></a><?endif?>

<?if($IMG_URL3$)?><a href="$IMG_URL3$" class="ulightbox"><img src="$IMG_SMALL_URL3$" alt="$TITLE$" /></a><?endif?>

<?if($IMG_URL4$)?><a href="$IMG_URL4$" class="ulightbox"><img src="$IMG_SMALL_URL4$" alt="$TITLE$" /></a><?endif?>

<?if($IMG_URL5$)?><a href="$IMG_URL5$" class="ulightbox"><img src="$IMG_SMALL_URL5$" alt="$TITLE$" /></a><?endif?>

<?if($IMG_URL6$)?><a href="$IMG_URL6$" class="ulightbox"><img src="$IMG_SMALL_URL6$" alt="$TITLE$" /></a><?endif?>

<?if($IMG_URL7$)?><a href="$IMG_URL7$" class="ulightbox"><img src="$IMG_SMALL_URL7$" alt="$TITLE$" /></a><?endif?>

здесь я прописал условие для вывода 7 фото от 1 по 7, если фото не будет прикреплено, выводиться пустое место не будет, как будет прикреплено, тогда сработает условие и выведет фото. Так же добавлю, у вас сейчас в материалах прописаны уже коды вида $IMAGE1$ если сейчас установить код что выше, фото будут дублироваться, нужно удалить ваши коды прописанные в материалах между текста, после дублироваться не будет.

после в стили прописать:

#desc_text img {
    float: left;
    margin: 0 2px!important;
    max-width: 150px!important;
    max-height: 100px!important;
}

вот и все.

Comments

плюс к тому же, в вашем примере отсутствует возможность пролистывания изображений

---

Ваш совет работает только на главной странице доски объявлений в разделе вид материала, а мне нужно в разеделе страница материала и комментарий к нему, попытался переставить в нужный раздел но не сработало, изображения есть но опять же вид огромный, непомгло и внесение предложенных вами изменений в таблицу стилей CSS

---

Zagir,

Добавьте в шаблон страницы комментариев и отпишитесь, не удаляйте, посмотрим.

---

Yuri_Geruk,

Добавил все ваши изменения  страницу  дизайна материала и комментарий к нему и на страницу CSS

---

Zagir,

Заверните этот код с фото в следующий код:

< div id="desc_text">здесь код с фото что выше</div>

после должно получиться, после внесения изменений обязательно обновите страницу чтобы обновился кеш. Как вижу в стили вы не добавили код о котором я говорил и удалите в самом низу текст в табице стилей:

Изменение цвета таблицы при наведении курсора

это же не блокнот где можно мемуары писать, это таблица стилей для стилей, а не текста.

---

Yuri_Geruk,

Заверните этот код с фото в следующий код:

< div id="desc_text">здесь код с фото что выше</div>

 

Если вы об этом:

 < div id="desc_text">

<?if($IMG_URL1$)?><a href="$IMG_URL1$" class="ulightbox"><img src="$IMG_SMALL_URL1$" alt="$TITLE$" /></a><?endif?>
<?if($IMG_URL2$)?><a href="$IMG_URL2$" class="ulightbox"><img src="$IMG_SMALL_URL2$" alt="$TITLE$" /></a><?endif?>
<?if($IMG_URL3$)?><a href="$IMG_URL3$" class="ulightbox"><img src="$IMG_SMALL_URL3$" alt="$TITLE$" /></a><?endif?>
<?if($IMG_URL4$)?><a href="$IMG_URL4$" class="ulightbox"><img src="$IMG_SMALL_URL4$" alt="$TITLE$" /></a><?endif?>
<?if($IMG_URL5$)?><a href="$IMG_URL5$" class="ulightbox"><img src="$IMG_SMALL_URL5$" alt="$TITLE$" /></a><?endif?>
<?if($IMG_URL6$)?><a href="$IMG_URL6$" class="ulightbox"><img src="$IMG_SMALL_URL6$" alt="$TITLE$" /></a><?endif?>
<?if($IMG_URL7$)?><a href="$IMG_URL7$" class="ulightbox"><img src="$IMG_SMALL_URL7$" alt="$TITLE$" /></a><?endif?></div>

 

то это тоже непомогло.

 

 

 

Код прописан в таблице стилей

---

Zagir,

Вот так более правильно:

<div id="desc_text">
<?if($IMG_URL1$)?><a href="$IMG_URL1$" class="ulightbox"><img src="$IMG_SMALL_URL1$" alt="$TITLE$" /></a><?endif?>
<?if($IMG_URL2$)?><a href="$IMG_URL2$" class="ulightbox"><img src="$IMG_SMALL_URL2$" alt="$TITLE$" /></a><?endif?>
<?if($IMG_URL3$)?><a href="$IMG_URL3$" class="ulightbox"><img src="$IMG_SMALL_URL3$" alt="$TITLE$" /></a><?endif?>
<?if($IMG_URL4$)?><a href="$IMG_URL4$" class="ulightbox"><img src="$IMG_SMALL_URL4$" alt="$TITLE$" /></a><?endif?>
<?if($IMG_URL5$)?><a href="$IMG_URL5$" class="ulightbox"><img src="$IMG_SMALL_URL5$" alt="$TITLE$" /></a><?endif?>
<?if($IMG_URL6$)?><a href="$IMG_URL6$" class="ulightbox"><img src="$IMG_SMALL_URL6$" alt="$TITLE$" /></a><?endif?>
<?if($IMG_URL7$)?><a href="$IMG_URL7$" class="ulightbox"><img src="$IMG_SMALL_URL7$" alt="$TITLE$" /></a><?endif?>
</div>

была ошибка в коде.

---

Yuri_Geruk,

Заработало, Спасибо!  Ещё добавил скрипт:   <script type="text/javascript"> $('a.ulightbox').attr({'rel':'group','data-fancybox-group':'group'}); </script>   появилась возможность перелистывания изображений )))