Регистрация
Вход через соцсети
Восстановление пароля

Помогите подправить шаблон фотогалереи

Новый топик
Страницы: 1  |  2
15.02.2007, 13:28
Ответить | Цитировать
malich
Андрей Малков

Зарегистрирован:
2005-08-09
Сообщений: 522

Подскажите по верстке фотогалерея должна быть реализована следующим образом, на страничке присутствуют маленькие изображения, при щелчке на них большое открывается в том же самом окне, реализовано это следущим образом:
1. код страницы

<img src="i/gallery/foto1.jpg" id="a1" class="foto_img" /> (большое изображение)

<div class="foto" id="d1"><a href="javascript:void(0)" onclick="vis(1)"><img src="i/gallery/prev/foto1.jpg" id="c1" /> (маленькое изображение)

2. скрипт
function vis(blc) {
hide();
document.getElementById("c"+blc).style.cssText= 'border: #D9D9D9 solid 6px; margin: 0px;';
document.getElementById("b"+blc).style.visibility = 'hidden';
document.getElementById("d"+blc).style.font= '100 14px Arial';
blc=document.getElementById("a"+blc);
blc.style.visibility = 'visible';
blc.style.display = 'block';
}

function hide() {
for (i=1;i<4;i++) {
document.getElementById("c"+i).style.cssText= 'border: #D9D9D9 solid 1px; margin: 6px 0px 0px 0px;';
document.getElementById("d"+i).style.font= '900 14px Arial';
document.getElementById("b"+i).style.visibility = 'visible';
blc=document.getElementById("a"+i);
blc.style.visibility = 'hidden';
blc.style.display = 'none';
}
}


var WFphoto={



showphoto:function(num){
addr='i/gallery/foto'+num+'.jpg';
return {addres: addr};
}
};



Каким образом можно переделать шаблон фотогалереии, чтобы реализовать данное? а именно подставлять id? может его можно брать из какого то поля?
15.02.2007, 14:14
Ответить | Цитировать
malich
Андрей Малков

Зарегистрирован:
2005-08-09
Сообщений: 522

Сделал через $f_RowID
28.02.2007, 13:15
Ответить | Цитировать
vika_rekhouse

Зарегистрирован:
2007-01-18
Сообщений: 9

У меня подобная проблема. malich, можешь подробнее рассказать как можно такое реализовать?
09.03.2007, 16:06
Ответить | Цитировать
Гость
Гость

Я так до конца и не справился, если будет идеи скидывай сюда
09.03.2007, 18:29
Ответить | Цитировать
h/z

Зарегистрирован:
2007-02-06
Сообщений: 755

так в чем проблема возникла? в передаче ID записи или в реализации ява-скриптового кода ?
14.03.2007, 16:41
Ответить | Цитировать
Гость
Гость

Споткнулся вот на этой строчке
addr='i/gallery/foto'+num+'.jpg';

тут прописан адрес до картинок и формат их названия, возможно это просто от незнания.

Нужно подставлять адрес неткатовской папки и имени фотографий
14.03.2007, 19:03
Ответить | Цитировать
h/z

Зарегистрирован:
2007-02-06
Сообщений: 755

т.к. адреса в фотогаллереи НетКет вычислить не получится,
то выводите их в JS массив

в макете для фотогаллереи добавьте
Код:
<script>
imgArray = new Array();
".s_list_class($sub,$cc,"&array=1&curPos=$curPos")."
</script>



в самом шаблоне фотогаллереи при запросе array=1
не выводите футер и хедер, а сам вывод листинга настройте как вывод JS массива
imgArray['ph'+$f_RowID] = '$f_название_поля_большой_фотки';
(именованный массив)

таким образом JS скрипт надо будет подправить
addr = imgArray['ph'+num];
29.03.2007, 10:17
Ответить | Цитировать
malich
Андрей Малков

Зарегистрирован:
2005-08-09
Сообщений: 522

h/z объясните поподробнее - запутался - сделал так:

в шаблоне фотогалереи:
Код:
<img src=$f_BigPhoto id=a$f_RowID class=foto_img />
$f_RowID
<div class=foto id=d$f_RowID>
<a href="javascript:void(0)" onclick="vis(1)"><img src=$f_SmallPhoto id=c$f_RowID />
$f_AdminButtons


в макете дизайна фотогалереи:
Код:
<head>
<script src="/photogal.js"></script>
</head>
<body>

<script>
imgArray = new Array();
".s_list_class($sub,$cc,"&array=1&curPos=$curPos")."
</script>



сам скрипт подправил вот так:
Код:
	function vis(blc) {
hide();
document.getElementById("c"+blc).style.cssText= 'border: #D9D9D9 solid 6px; margin: 0px;';
document.getElementById("b"+blc).style.visibility = 'hidden';
document.getElementById("d"+blc).style.font= '100 14px Arial';
blc=document.getElementById("a"+blc);
blc.style.visibility = 'visible';
blc.style.display = 'block';
}

function hide() {
for (i=1;i<4;i++) {
document.getElementById("c"+i).style.cssText= 'border: #D9D9D9 solid 1px; margin: 6px 0px 0px 0px;';
document.getElementById("d"+i).style.font= '900 14px Arial';
document.getElementById("b"+i).style.visibility = 'visible';
blc=document.getElementById("a"+i);
blc.style.visibility = 'hidden';
blc.style.display = 'none';
}
}


var WFphoto={



showphoto:function(num){
addr = imgArray['ph'+num];
return {addres: addr};
}
};



Естественно, большие фототографии не открываются - что еще нужно подправить, а именно куда вставить:
Код:
<script>
imgArray = new Array();
".s_list_class($sub,$cc,"&array=1&curPos=$curPos")."
</script>


Код:
imgArray['ph'+$f_RowID] = '$f_название_поля_большой_фотки';
29.03.2007, 18:34
Ответить | Цитировать
h/z

Зарегистрирован:
2007-02-06
Сообщений: 755

1) наверное вы имели ввиду

в шаблоне фотогалереи:
Цитата:
<img src=$f_BigPhoto id=a$f_RowID class=foto_img />
$f_RowID
<div class=foto id=d$f_RowID>
<a href='javascript:void(0);' onclick='vis($f_RowID);'><img src=$f_SmallPhoto id=c$f_RowID />
$f_AdminButtons


2) подправляем шаблон таким образом:
Цитата:

".($array?"
imgArray['ph'+$f_RowID] = '$f_BigPhoto';
":"
<script>
imgArray = new Array();
".s_list_class($sub,$cc,"&array=1&curPos=$curPos")."
</script>

<img src=$f_BigPhoto id=a$f_RowID class=foto_img />
$f_RowID
<div class=foto id=d$f_RowID>
<a href='javascript:void(0);' onclick='vis($f_RowID);'><img src=$f_SmallPhoto id=c$f_RowID />
$f_AdminButtons
")."


и конечно не забываем поставить проверки в футере и хедере шаблона, если там что-то выводится
Цитата:
".opt(!$array,"")."



p.s. когда заработает, скиньте ссылку на работающий пример, и выложите пожалуйста содержимое всех полей.. перенесем в базу знаний ;)
30.03.2007, 03:03
Ответить | Цитировать
Гость
Гость

как вариант можно использовать класс Lightbox
http://www.huddletogether.com/projects/lightbox2/
30.03.2007, 10:16
Ответить | Цитировать
malich
Андрей Малков

Зарегистрирован:
2005-08-09
Сообщений: 522

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

еще раз:

В шаблоне фотогалереи - объект в списке
Код:
".($array?"
imgArray['ph'+$f_RowID] = '$f_BigPhoto';
":"
<script>
imgArray = new Array();
".s_list_class($sub,$cc,"&array=1&curPos=$curPos")."
</script>

<img src=$f_BigPhoto id=a$f_RowID class=foto_img />
$f_RowID
<div class=foto id=d$f_RowID>
<a href="javascript:void(0)" onclick="vis($f_RowID)"><img src=$f_SmallPhoto id=c$f_RowID /><h4>
<img src="http://chel-city.paramon.ru/images/city/b/zoom.gif" id=b$f_RowID /></a>Главный холл</h4></div>
$f_AdminButtons
")."


Поля в шаблоне: SmallPhoto и BigPhoto из стандартной фотогалереи

Остальные поля пустые.
Макет дизайна - фотогалерея

Код:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name=Description content="".$current_sub[Description]."">
<meta name=Keywords content="".$current_sub[Keywords]."">
<link rel="stylesheet" href="путь_до_скрипта/style.css"></link>
<title>".strip_tags($f_browse_path=s_browse_path($browse_path))."</title>
<script src="путь_до_скрипта/photogal.js"></script>
</head>

<body>

".opt(!$array,"")."


Собственно сам скрипт:
Код:
			function vis(blc) {
hide();
document.getElementById("c"+blc).style.cssText= 'border: #D9D9D9 solid 6px; margin: 0px;';
document.getElementById("b"+blc).style.visibility = 'hidden';
document.getElementById("d"+blc).style.font= '100 14px Arial';
blc=document.getElementById("a"+blc);
blc.style.visibility = 'visible';
blc.style.display = 'block';
}

function hide() {
for (i=1;i<4;i++) {
document.getElementById("c"+i).style.cssText= 'border: #D9D9D9 solid 1px; margin: 6px 0px 0px 0px;';
document.getElementById("d"+i).style.font= '900 14px Arial';
document.getElementById("b"+i).style.visibility = 'visible';
blc=document.getElementById("a"+i);
blc.style.visibility = 'hidden';
blc.style.display = 'none';
}
}


var WFphoto={



showphoto:function(num){
addr = imgArray['ph'+num];
return {addres: addr};
}
};



Скрипт выполняется с ошибкой, скорее всего дело в передаче ему адреса большой картинки - но как это подправить, пока понять не могу... Давайте решим сообща...!!!
198 196 2007-04-04 12:40:10 8882
Страницы: 1  |  2
Описание проекта