Форум Сайтостроение Веб-строительство

Pop-up фото.

123
Ёжик В Тумане
На сайте с 26.07.2006
Offline
16
Ёжик В Тумане
#11

Jackyk, не стоит лезть в движок сайта, Ваша задача решается примерно так (что надо исправьте сами): 


<html>

<head>

<script type="text/javascript">

	function img(url){

		img = new Image();

		img.src = url;

		 newWin= open("", "PhotoAlbumWindow", "width="+img.width +",height="+img.height +",status=no,toolbar=no,menubar=no,directories=no,location=no,resizable=no");

		  newWin.document.open();

		  newWin.document.write("<html><head><title>Фотоальбом</title></head>");

		  newWin.document.write("<body><a href=\"javascript:window.close()\"><img src='" + url +"' /></a></body></html>");

		  newWin.document.close();  

		 

	}

</script>

</head>



	<body>

		<img src="foto.gif" onclick='img("foto.gif")' style="cursor:pointer;" />

	</body>

</html>

Решение не стандартное, но работает великолепно.☝

Ушел в себя, забыл про форум.
Вернусь ли? Не знаю... Если нужен, пишите в аську...
Jackyk
На сайте с 05.10.2005
Offline
342
Jackyk
#12

Ёжик В Тумане, большое спасибо, надо будет попробовать. В движок лезть приходится по-любому, как минимум для того, чтобы получать URL закачанных фото, URL сгенерированных системой фото нескольких измененных размеров, размеры фото для задания размеров окна и т.д. Подразумевается ведь, что мы ничего этого не знаем и знать не хотим, закачали визуальным редактором фото, а дальше пусть система всё делает сама. Кроме того, все же этот код вставляется не иначе как в определенный темплэйт движка, а там свои заморочки. В-общем, без того, чтобы лезть в движок, не обойтись, но это не страшно, он для этого и предназначен.

Еще раз большое спасибо, надо будет попробовать обязательно.

С уважением, Евгений.
Вопрос про dynadot.com URL-адреса-сироты Анализ трафика из метрики
Ёжик В Тумане
На сайте с 26.07.2006
Offline
16
Ёжик В Тумане
#13
Jackyk:
Ёжик В Тумане, большое спасибо, надо будет попробовать. В движок лезть приходится по-любому, как минимум для того, чтобы получать URL закачанных фото, URL сгенерированных системой фото нескольких измененных размеров, размеры фото для задания размеров окна и т.д. .

URL передать придется, но размеры pop up окна с большим фото JavaScript вычислит сам :) .

Bush
На сайте с 19.07.2006
Offline
108
Bush
#14

Ёжик В Тумане, первый клик появляется новое окно, а на второй глючит.

Jackyk
На сайте с 05.10.2005
Offline
342
Jackyk
#15
Ёжик В Тумане:
URL передать придется, но размеры pop up окна с большим фото JavaScript вычислит сам

В смысле - так и надо задавать "+img.width +"? С плюсами? И значение будет вычислено?

Ёжик В Тумане
На сайте с 26.07.2006
Offline
16
Ёжик В Тумане
#16

Просто скопируйте пример и попробуйте.

Jackyk:
В смысле - так и надо задавать "+img.width +"? С плюсами? И значение будет вычислено?

ну когда создается новое окно то нужно задать: 


"width=размер"

а img.width, так это в объекте, наследованном от встроенного класса Image обращаюсь к размеру текущего изображения, аналогично img.height, да и вообще обратится можно ко всем свойствам какие есть у изображения.

Jackyk:

Ёжик В Тумане, первый клик появляется новое окно, а на второй глючит.

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

Что за стандарт такой Магазин Доменов Рег.ру - Вопрос по js, как
Bush
На сайте с 19.07.2006
Offline
108
Bush
#17

Вот еще вариант на css.

Стиль: 


<style type="text/css">



.thumbnail{

position: relative;

z-index: 0;

}



.thumbnail:hover{

background-color: transparent;

z-index: 50;

}



.thumbnail span{ /*CSS for enlarged image*/

position: absolute;

background-color: lightyellow;

padding: 5px;

left: -1000px;

border: 1px dashed gray;

visibility: hidden;

color: black;

text-decoration: none;

}



.thumbnail span img{ /*CSS for enlarged image*/

border-width: 0;

padding: 2px;

}



.thumbnail:hover span{ /*CSS for enlarged image on hover*/

visibility: visible;

top: 0;

left: 60px; /*position where enlarged image should offset horizontally */



}



</style>

Тело: 

<a class="thumbnail" href="#thumb"><img src="yourSmall_img" width="100px" height="66px" border="0" /><span><img src="yourBig_img" /><br />Simply beautiful.</span></a>
K
На сайте с 20.12.2004
Offline
62
Kastorskiy
#18
Jackyk:
Я, собственно, поэтому и интересуюсь, как сделать красиво.

вот так: http://wanderers.webest.net/gallery/ - это красиво?

Если да, то в джаваскрипте есть ссылка на сайт-первоисточник, на котором написано, как реализовать.

Лучше день потерять, а потом за пять минут долететь (c (http://andrey.lviv.ua/)) м/ф "Крылья, ноги, хвост"
Bush
На сайте с 19.07.2006
Offline
108
Bush
#19
Kastorskiy:
вот так: http://wanderers.webest.net/gallery/ - это красиво?
Если да, то в джаваскрипте есть ссылка на сайт-первоисточник, на котором написано, как реализовать.

Вот и ссылка http://www.huddletogether.com/projects/lightbox2/

K
На сайте с 20.12.2004
Offline
62
Kastorskiy
#20

Точнее эта: http://beholder-eye.info/2006/03/13/litebox

Мне этот вариант реализации больше понравился.

123

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий