fancybox - пример pop up окна для вывода информации в ваншопе
Долго искал готовое для вывода внешних страниц при помощи fancybox так как он встроин в ваншоп и чтоб не подключать другие фреймворки (не хотелось разбираться в нем ) везде инфа о выводе галерей (тобиш картинок в всплывающих окнах) , но пришлось осваивать.
Пример всплывающего окна при помощи fancybox в ваншопе (можно вывести любое диалоговое окно или информацию).
Допустим хотим вывести авторизацию:
изначально в ваншопе уже подключон fancybox (строки вида в includes/header.php )
<script type="text/javascript" src="jscript/jquery/jquery-1.4.2.min.js"></script>
...
<link rel="stylesheet" type="text/css" href="jscript/jquery/plugins/fancybox/jquery.fancybox-1.2.5.css" media="screen" />
<script type="text/javascript" src="jscript/jquery/plugins/fancybox/jquery.fancybox-1.2.5.pack.js"></script>
если нет в вашей версии , качайте прикручивайте jquery и fancybox
в includes/header.php добавляем код (выделеное):
<script type="text/javascript">
jQuery.noConflict();
jQuery(document).ready(function() {
jQuery("a.zoom").fancybox({
"zoomOpacity" : true,
"overlayShow" : false,
"zoomSpeedIn" : 500,
"zoomSpeedOut" : 500
});
});
jQuery(document).ready(function() {
jQuery("#varLogin").fancybox({
'frameWidth' : 200,
'frameHeight' : 190,
'hideOnContentClick': false,
'modal' : true,
'transitionIn' : 'none',
'transitionOut' : 'none',
'type' : 'iframe'
});
});
</script>
varLogin - метка (ид фрейма запуска окна)
frameWidth,frameHeight - размер окна
hideOnContentClick - отключим закрытие окна при клике
type - тип блока
остальное читайте в АПИ
еще ети строки включаются в ваншопе только для карточки товара , чтоб они работали везде удалите
перед етим блоком и после строки
<?php
if (strstr($PHP_SELF, FILENAME_PRODUCT_INFO)) {
?>
НАШ КОД
<?php
}
?>
вызов делаете:
<a href="max-registr.html" title="Вход" id="varLogin" class="lbtn"><img src="{$tpl_path}images/btn-registr.gif" /></a>
где max-registr.html страница в корне сайта вида
<div class="boxcontent">
<form id="loginbox" method="post" action="http://new.btmax.com.ua/login.php?action=process">
<p>
E-Mail:
</p>
<p class="loginform">
<input type="text" name="email_address">
</p>
<p>
Пароль:
</p>
<p class="loginform">
<input type="password" name="password">
</p>
<p class="LoginContentCenter">
<input type="image" src="templates/btmax/buttons/russian/button_login_small.gif" alt="Продолжить" title=" Продолжить ">
</p>
</form>
<p class="LoginContentCenter">
<a href="http://new.btmax.com.ua/create_account.php">Регистрация</a> | <a href="http://new.btmax.com.ua/password_double_opt.php">Забыли пароль?</a>
</p>
Вроде все, статья делась больше для себя как шпаргалка (тоесть быстро, сори может чо упустил и код не чистился), надеюсь поможет и вам :) .