[masaynay86]

Ребятушки, миленькие, помогите, пожалуйста!
Я лузер в javascript, очень нужна помощь
Есть fancybox для Wordpress, на сайте галерея товаров, нужно добавить кнопочку "заказать сейчас" к каждой картинке в окне fancybox, чтобы по кнопочке открывалось окно с формой заказа, после закрытия формы пользователь должен возвращаться к картинке в окне fancybox и продолжить просмотр, т.е. она не должна закрываться при открытии формы.

Ссылку-кнопку добавила в Title фэнсибокса, файл jquery.fancybox.js, строка 52 (добавила в Title тег a):

d.titlePosition=="float"?'<table id="fancybox-title-float-wrap" cellpadding="0" cellspacing="0"><tr><td id="fancybox-title-float-left"></td><td id="fancybox-title-float-main"><a href="#">'+s+'</a></div></td><td id="fancybox-title-float-right"></td></tr></table>':'<div id="fancybox-title-'+d.titlePosition+'">'+s+"</div>":false;s=a;if(!(!s||s==="")){n.addClass("fancybox-title-"+d.titlePosition).html(s).appendTo("body").show();switch(d.titlePosition){case "inside":n.css({width:i.width-d.padding*2,marginLeft:d.padding,marginRight:d.padding});

Думала 2 решения:
1. Сделать отдельную страничку с формой form.php, и по ссылке в fancybox открывать ее (страничку) в отдельном всплывающем окне или в фэнсибоксе тоже. Для открытия в фэнсибоксе нужно поставить class="fancybox" для тега , ну и href указать соответственно, но это не работает, просто ничего не происходит...
Для открытия в отдельном всплывающем окне нужно использовать следующую конструкцию:

<a href="#" onclick="window.open('http://ya.ru','test', 'width=250,height=280,status=no,resizable=no,top=200,left=200'); return false;">open window</a>

Но эта строчка в коде jquery.fancybox.js не работает, выдается ошибка, в адресе сайта не воспринимаются слэши //, идут как пробелы...

Помогите, пожалуйста, мне все равно, хоть так, хоть так, главное, чтобы уже открытая картинка в фэнсибоксе не закрылась...

2. второй вариант такой:
форму сделать на самом сайте, в блоке div, невидимой, а при нажатии делать его видимым и поверх всех окон. Нашла такой код:

сама форма:

<div class="popup-window">
<p class="close">x</p>
<table><tr>
<td>Имя:</td>
<td><input type="text"/></td>
</tr>
<tr>
<td>E-mail:</td>
<td><input type="text"/></td>
</tr>
<tr>
<td colspan="2" align="center"><input type="submit"/></td>
</tr>
</table>
</div>

форма, конечно, будет немного другая, но это не суть.
css:

<style type="text/css">
		.popup-window{	//форма для заполнения
			display: none;
			box-shadow: 0px 0px 4px 0px rgb(70, 70, 70);
			-webkit-box-shadow: 0px 0px 4px 0px rgb(70, 70, 70);
			-moz-box-shadow: 0px 0px 4px 0px rgb(70, 70, 70);
			padding: 20px;
			background: white;
			z-index: 500;
			-webkit-border-radius: 5px!important;
			-moz-border-radius: 5px!important;
			border-radius: 5px!important;
		}
		.open{ 	//кнопка-ссылка
			text-decoration: underline;
			cursor: pointer;
		}
		.backpopup{		//тень
			display:none;
			width: 100%;
			height: 100%;
			position: fixed;
			background: rgb(105, 105, 105);
			opacity: 0.7;
			top: 0;
			left: 0;
			z-index: 400;
			cursor: pointer;
		}
		.close{		//кнопка закрытия окна
			float: right;
			cursor: pointer;
			right: 5px;
			top: 0px;
			position: absolute;
			padding: 4px;
		}
	</style>

вставляем ссылку:

<p class="open">Открыть всплывающее окно</p>
<div class="backpopup"></div>

ну и скрипт:

<script type="text/javascript">
		$.fn.popup = function() { 	//функция для открытия всплывающего окна:
			this.css('position', 'absolute').fadeIn();	//задаем абсолютное позиционирование и эффект открытия
			//махинации с положением сверху:учитывается высота самого блока, экрана и позиции на странице:
			this.css('top', ($(window).height() - this.height()) / 2 + $(window).scrollTop() + 'px');
			//слева задается отступ, учитывается ширина самого блока и половина ширины экрана
			this.css('left', ($(window).width() - this.width()) / 2  + 'px');
			//открываем тень с эффектом:
			$('.backpopup').fadeIn();
		}
		$(document).ready(function(){	//при загрузке страницы:
			$('.open').click(function(){	//событие клик на нашу ссылку
				$('.popup-window').popup();	//запускаем функцию на наш блок с формой
			});
			$('.backpopup,.close').click(function(){ //событие клик на тень и крестик - закрываем окно и тень:
				$('.popup-window').fadeOut();
				$('.backpopup').fadeOut();
			});
		});
	</script>

Для этого варианта я ссылку вставила в файл jquery.fancybox.js вместо тега A, туда же добавила форму, в начало страницы (в head) добавила css, а вот сам скрипт вообще не понимаю, куда надо вставлять.
Разъясните, кто может, пожалуйста!