PDA

Просмотр полной версии : увеличение картинок по нажатию.

*****
07.07.2006, 17:42
очень прошу помочь.
необходимо в контент выводить картинки до 5 штук. при нажатии на какую-либо из них, она должна показываться чуть ниже в увеличенном варианте.
была написана функция на js. в html это выглядит вот так
<html>
<head>
<script language="JavaScript">
function image_viewer(divid, imgname)
{
var img = document.getElementById(divid);
img.src = imgname;
img.style.display = "";
}
</script>
</head>
<body>
<form id="theform" name="theform">
<a href="javascript:image_viewer('theimg', '2423_full.jpg')"><img src='2423_full.jpg' width="150"></a>
<div id="thediv">
<img style="display:none" src="" id="theimg"></img>
</div>
</form>
</body>
</html>

довольно просто. проблема состоит в том, чтобы
1. выводить картинки в ссылках (думаю, если очень поискать, то можно найти записи для setup, которые будут оборачивать картинки в ссылки)
2. самое главное, что если сделать пункт 1, то получится, что такая процедура будет производиться со всеми картинками на сайте, а мне надо только с определенными
(уменьшенные изображения моделей мебели. должны увеличиваться соответственно)
советовали писать свой новый модуль, но у меня на это крайне мало времени и пока что опыта.
помогите, если знаете как.
спасибо.
void
07.07.2006, 19:18
Как я понимаю, вам нужно, чтобы увеличивались только картинки внутри определенного div'a
Что мешает найти этот div через document.getElementById
var div=document.getElementById('mydiv'),
найти в нем картинки
var images = div.getElementsByTagName("IMG");
а затем каждой приписать свой onClick
for (i=0;i<images.length;i++)
{
images.onClick = function ()
{
тут допишите..
}
}
*****
07.07.2006, 20:47
Понимаете, в чем еще проблема.
когда типа уменьшает картинку, она кидеат ее в папку typo3temp/pics/
и меняет ее название, а сами оригиналы лежат в uploads. так что когда вы достанете img из дива, там будут не те пути, что нужно.
у меня уже крыша едет от всего этого. вроде бы все просто, а реализовать никак не получается.
void
07.07.2006, 22:51
Хм... лучше написать свой плагин, возможно...
Или же помудрить с tt_content.image.20.1 (посмотрите в TypoScript Object Browser)
Pavel Antonov
07.07.2006, 23:50
Понимаете, в чем еще проблема.
когда типа уменьшает картинку, она кидеат ее в папку typo3temp/pics/
и меняет ее название, а сами оригиналы лежат в uploads. так что когда вы достанете img из дива, там будут не те пути, что нужно.
у меня уже крыша едет от всего этого. вроде бы все просто, а реализовать никак не получается.
Это не проблема...а состояние дел. Где проблема то?

Нужна картинка в таге <img /> используйте IMAGE, нужна ссылка на картинку - используйте IMG_RESOURCE и подставляйте в свой <a href="javascript..."> правельные пути. Нужно увеличеную и маленькую версию - тоже не проблема, вызовите два раза!
*****
09.07.2006, 17:26
Да. нужна ссылка на картинку. то есть ее оригинал в uploads. подскажите, как с помощью IMG_RESOURCE в функцию передать путь к картинке.
на данный момент в setup написано
10 = IMAGE
10{
file{
import = uploads/pics/
import.current = 1
width.field = imagewidth
height.field = imageheight
maxW = {$styles.content.imgtext.maxW}
maxW.override.data = register:maxImageWidth
}
linkWrap = <a href="javascript:image_viewer()"> | </a>
wrap = | <br>
}

но пока это не работает, так как в функцию ничего не передается.
*****
10.07.2006, 20:54
ну поделитесь опытом хоть кто-нибудь.
Pavel Antonov
11.07.2006, 00:19
Например так:


lib.img_with_popup = COA
lib.img_with_popup {
10 = IMG_RESOURCE
10 {
file {
import = uploads/pics/
import.current = 1
}
stdWrap.wrap = <a href="javascript:image_viewer(|)">
}

20 = IMAGE
20{
file{
import = uploads/pics/
import.current = 1
width.field = imagewidth
height.field = imageheight
maxW = {$styles.content.imgtext.maxW}
maxW.override.data = register:maxImageWidth
}
}

wrap = |</a><br>
}
*****
11.07.2006, 17:24
большое вам спасибо. все заработало.
а разделить ссылку - это вы хорошо придумали :)
спасибо еще раз.
Pavel Antonov
12.07.2006, 12:27
"крылья, ноги.... главное мозг!" ;)