|
|
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};
}
};
Скрипт выполняется с ошибкой, скорее всего дело в передаче ему адреса большой картинки - но как это подправить, пока понять не могу... Давайте решим сообща...!!!
|
