Форум

snake01 · #11 (**permalink**) 07.02.2015, 12:50

Deff,

К сожалению у меня не так уж просто все. уже 2 недели мучаюсь.

Мой код таков:

<label for="' . $productCustom->virtuemart_customfield_id .$row. '" class="other-customfield"> 

<a href="#1" >' . $this->displayProductCustomfieldFE ($product, $productCustom, $row) . '</a></label>';

Строка которая находиться в теге <a> гененрирует маленькие изображения. изображении от 5-30 штук.

Как вы уже поняли я не могу вписать в href="#1" ссылки на большие изображения. т. к. нужно как то генерировать и большие изображения или хотя бы в href="" вписать код который будет тоже генерировать ссылки на малые изображения.

Я в ручную поменял малые изображение на большие, Чтобы качество было хорошее при увлечении.

С помощью вашего скрипта выше, получился увеличивать изображение при клике. В роли большой ссылки на изображения играет #1. но не красиво все получается картинки друг на друга лезут. По этому нужно чтобы он открывался красиво на весь экран....

Буду очень благодарен за помощь.

Скриншот http://img4.tempfile.ru/14037/13fc7c...7c924a50b7.png

п. с. Если удастся как то в href="" вписать код который будет генерировать ссылки на малые изображения. то я могу к тегу <а> прописать стандартный тег который есть на сайте и изображения будут увеличиваться без лишних кодов и скриптов.

ritorica · #12 (**permalink**) 26.01.2016, 13:06

Сообщение от ksa

Как вариант...

Как вариант [2]...

<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<style type="text/css">
p { clear: both }
.sizeable { display: block; float: left; cursor: pointer; padding: 6px }
.fullscr { position: absolute; top: 0; left: 0; cursor: pointer }
.fullscr > img { width: 100%; height: 100% }
</style>
<script type="text/javascript">
$(document).ready(function () {
    $('div img').click(function () {
	var o = $(this).parent();
        var url = o.find('img').attr('src');
	var oftop = window.scrollY;
        var html = '<div class="fullscr" style="top: '+oftop+'px"><img src="'+url+'" /></div>'
        o.append(html);
        o = o.find('.fullscr');
        o.animate({width:'100%',height:'100%'});
        o.click(function () {
		$(this).remove();
        });
    });

	$(window).scroll(function() {
		$('div.fullscr').remove();
	});
});
</script>
</head>
<body>
<p>some text
<div class="sizeable"><img src='http://javascript.ru/forum/images/ca_serenity/misc/logo.gif' /></div>
<div class="sizeable"><img src='http://javascript.ru/forum/images/ca_serenity/misc/logoNY.jpg' /></div>
<p>more text
</body>
</html>

рони · #13 (**permalink**) 26.01.2016, 13:15

ritorica,
на всякий случай

[HTML run]добавьте парамерт запуска кода run[/HTML]

Madzal · #14 (**permalink**) 24.02.2016, 02:43

а можно такое реализовать без жхуерити ?

Mary38 · #15 (**permalink**) 23.02.2017, 11:37

А можно подсказать, как написать скрипт, чтобы можно было фотогалерею с стрелочкой для обзора , чтобы можно было закрыть и чтобы в том же диалоговом окне сверху?
Такой простой способ не интересует, не каждый может догадаться, что нужно ещё раз нажать на фото, чтобы оно уменьшилось и если фотографий больше то они все смещаются, что приносит хаос в галерее.

рони · #16 (**permalink**) 23.02.2017, 12:13

Mary38,
jquery-zoom/

Mary38 · #17 (**permalink**) 23.02.2017, 17:03

И что?

Спасибо, уже нашла, уже сделала.

Форум

Справочник

Discord чат

Курсы javascript