Перейти к содержимому


"Спартанское" Всплывающее Окно


  • Авторизуйтесь для ответа в теме
Сообщений в теме: 43

#21 JnkSmpL

JnkSmpL

    Пользователь

  • Пользователи
  • PipPip
  • 23 сообщений

Отправлено 25 Сентябрь 2014 - 22:31

Добрый вечер. Подскажите пожалуйста, сделал все так, как сказано. Но при попытке нажать на ссылку, выдает

На странице возникла JS ошибка:


Uncaught TypeError: undefined is not a function на строке: 384.


Адрес файла: http://foggi.ru/goods/Futbolka-2



Пример можно увидеть перейдя по ссылке выше.

#22 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 26 Сентябрь 2014 - 00:46

У вас немного другая галерея, сл.код:
<a href="#" id="size-page">Изображение №_</a> <script type="text/javascript">
$('a#size-page').click(function(e) {
e.preventDefault();
var width = 500; /*размер по ширине */
var height = 500; /*размер по высоте*/
var content = '<iframe src="Ссылка на изображение №_" width="'+width+'" height="'+height+'" align="left">Ваш браузер не поддерживает плавающие фреймы!</iframe>';
$.fn.nyroModalManual({
width: width,
height: height,
content: content,
minWidth: width,
minHeight: height,	 
gallery: null
});
return(false);
});
измените на:
<a href="#" id="size-page">Изображение №_</a>
<script>
$(document).ready(function() {
$("a#size-page").fancybox({
maxWidth : 300,
maxHeight : 330,
fitToView : false,
width : '70%',
height : '70%',
content: '<iframe src="Ссылка на изображение №_" width="'+width+'" height="'+height+'" align="left">Ваш браузер не поддерживает плавающие фреймы!</iframe>',
autoSize : false,
closeClick : false,
openEffect : 'none',
closeEffect : 'none'
});
});
</script>



#23 JnkSmpL

JnkSmpL

    Пользователь

  • Пользователи
  • PipPip
  • 23 сообщений

Отправлено 26 Сентябрь 2014 - 16:35

Просмотр сообщенияVaccina (26 Сентябрь 2014 - 00:46) писал:

У вас немного другая галерея, сл.код:
<a href="#" id="size-page">Изображение №_</a> <script type="text/javascript">
$('a#size-page').click(function(e) {
e.preventDefault();
var width = 500; /*размер по ширине */
var height = 500; /*размер по высоте*/
var content = '<iframe src="Ссылка на изображение №_" width="'+width+'" height="'+height+'" align="left">Ваш браузер не поддерживает плавающие фреймы!</iframe>';
$.fn.nyroModalManual({
width: width,
height: height,
content: content,
minWidth: width,
minHeight: height,	
gallery: null
});
return(false);
});
измените на:
<a href="#" id="size-page">Изображение №_</a>
<script>
$(document).ready(function() {
$("a#size-page").fancybox({
maxWidth : 300,
maxHeight : 330,
fitToView : false,
width : '70%',
height : '70%',
content: '<iframe src="Ссылка на изображение №_" width="'+width+'" height="'+height+'" align="left">Ваш браузер не поддерживает плавающие фреймы!</iframe>',
autoSize : false,
closeClick : false,
openEffect : 'none',
closeEffect : 'none'
});
});
</script>




Изменил, ничего не изменилось. Ошибка не пропала.

#24 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 26 Сентябрь 2014 - 23:19

используйте сл.код:
<a href="#" id="size-page">Изображение №_</a>
<script>
$(document).ready(function() {
$("a#size-page").fancybox({
maxWidth : 300,
maxHeight : 330,
fitToView : false,
width : '70%',
height : '70%',
content: 'текст или картинка',
autoSize : false,
closeClick : false,
openEffect : 'none',
closeEffect : 'none'
});
});
</script>

(с прошлым кодом не всплывало окно)

также не забудьте старый код удалить

#25 JnkSmpL

JnkSmpL

    Пользователь

  • Пользователи
  • PipPip
  • 23 сообщений

Отправлено 28 Сентябрь 2014 - 20:08

Просмотр сообщенияVaccina (26 Сентябрь 2014 - 23:19) писал:

используйте сл.код:
<a href="#" id="size-page">Изображение №_</a>
<script>
$(document).ready(function() {
$("a#size-page").fancybox({
maxWidth : 300,
maxHeight : 330,
fitToView : false,
width : '70%',
height : '70%',
content: 'текст или картинка',
autoSize : false,
closeClick : false,
openEffect : 'none',
closeEffect : 'none'
});
});
</script>

(с прошлым кодом не всплывало окно)

также не забудьте старый код удалить

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

#26 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 30 Сентябрь 2014 - 00:15

пришлите пожалуйста скриншот  указанием проблемы и уточните свой браузер, в mozilla подобной проблемы не наблюдаю

#27 JnkSmpL

JnkSmpL

    Пользователь

  • Пользователи
  • PipPip
  • 23 сообщений

Отправлено 03 Октябрь 2014 - 19:07

Спасибо, разобрался сам.
Подскажите вот еще. Ниже подвала появляются вот такие полосы, отдельные от фона (белые и розовые), видно белую вставку между сайтом и пуском. Как от не избавиться? или хотя бы сделать так, чтобы цвета совпадали с основным?
Изображение

#28 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 03 Октябрь 2014 - 20:09

В style.css найдите:
.two-third {
	float: left;
	width: 940px;
}
замените на:
.two-third {
	float: left;
	min-height: 250px;
	width: 940px;
}


#29 JnkSmpL

JnkSmpL

    Пользователь

  • Пользователи
  • PipPip
  • 23 сообщений

Отправлено 05 Октябрь 2014 - 14:59

Просмотр сообщенияVaccina (30 Сентябрь 2014 - 00:15) писал:

пришлите пожалуйста скриншот  указанием проблемы и уточните свой браузер, в mozilla подобной проблемы не наблюдаю


Опера

Пример скрина высылаю. Изображение

#30 Danil

Danil

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 4 645 сообщений

Отправлено 06 Октябрь 2014 - 13:12

Просмотр сообщенияJnkSmpL (05 Октябрь 2014 - 14:59) писал:

Опера

Пример скрина высылаю. Изображение
Здравствуйте.
Данной проблемы в браузере opera не обнаружено.
Если есть возможность, то посмотрите с другого компьютера.

#31 tanch

tanch

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 300 сообщений
  • ГородНовосибирск

Отправлено 12 Февраль 2016 - 00:00

Просмотр сообщенияVaccina (26 Сентябрь 2014 - 23:19) писал:

используйте сл.код:
 [url="#"]Изображение №_[/url] <script> $(document).ready(function() { $("a#size-page").fancybox({ maxWidth : 300, maxHeight : 330, fitToView : false, width : '70%', height : '70%', content: 'текст или картинка', autoSize : false, closeClick : false, openEffect : 'none', closeEffect : 'none' }); }); 
  

Использовала Ваш код, может где ошиблась:
<a href="http://st.larec-ledenec.ru/7/1820/793/repost.jpg" id="size-page"><img src=http://st.larec-ledenec.ru/9/1820/866/repost-button.jpg</a>
<script>
$(document).ready(function() {
$("a#size-page").fancybox({
maxWidth : 600,
maxHeight : 390,
fitToView : false,
width : '70%',
height : '70%',
content: '<img src=http://st.larec-ledenec.ru/7/1820/793/repost.jpg>',
autoSize : false,
closeClick : false,
openEffect : 'none',
closeEffect : 'none'
});
});

1). Появилось почему второе сердечко "Добавить в избранное"
2016-02-12 02-42-21 Скриншот экрана.png

2). А также хотелось бы перенести "Добавить в избранное" к Корзине

3). При уменьшении экрана - всплывающее окно вытягивается по вертикали
01.jpg 02.jpg 03.jpg

#32 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 12 Февраль 2016 - 00:34

<a href="http://st.larec-ledenec.ru/7/1820/793/repost.jpg" id="size-page"><img src=http://st.larec-ledenec.ru/9/1820/866/repost-button.jpg</a>
<script>
$(document).ready(function() {
$("a#size-page").fancybox({
maxWidth : 600,
maxHeight : 390,
fitToView : false,
width : '70%',
height : '70%',
content: '<img src=http://st.larec-ledenec.ru/7/1820/793/repost.jpg>',
autoSize : false,
closeClick : false,
openEffect : 'none',
closeEffect : 'none'
});
});
</script>

замените на:
<a href="http://st.larec-ledenec.ru/7/1820/793/repost.jpg" id="size-page"><img src=http://st.larec-ledenec.ru/9/1820/866/repost-button.jpg</a>
<script>
$(document).ready(function() {
$("a#size-page").fancybox({
maxWidth : 600,
maxHeight : 390,
fitToView : false,
width : '70%',
content: '<img src=http://st.larec-ledenec.ru/7/1820/793/repost.jpg>',
autoSize : false,
closeClick : false,
openEffect : 'none',
closeEffect : 'none'
});
});
</script>

переместите его, поставив после:
<div class="add-to-cart clear">
			<input type="hidden" name="form[goods_mod_id]" value="{GOODS_MOD_ID}" class="goodsDataMainModificationId" />
			<input type="button" value="В корзину" class="add-cart button btn-cart" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
			 <!--input type="button" value="Быстрый заказ" class="add-cart quick button btn-cart" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/-->
			<input type="button" value="Купить" class="button btn-cart quickview" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
		 


#33 tanch

tanch

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 300 сообщений
  • ГородНовосибирск

Отправлено 12 Февраль 2016 - 00:48

Просмотр сообщенияVaccina (12 Февраль 2016 - 00:34) писал:


Код заменила, но ничего не изменилась
Перенести к Корзине я хотела не свою кнопку "получить скидку", на которой всплывающее окно
а - "Добавить в избранное"

#34 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 12 Февраль 2016 - 01:10

Прошу прощение, на счет переноса отмените действие. После изменения кода, всплывающее окно не должно вытягиваться по высоте.
В шаблоне Товар найдите и удалите:
<li class="wishlist">
			<!-- Если есть возможность добавить товар в избранное -->
			{% IF GOODS_MOD_IS_HAS_IN_FAVORITES_LIST %}
			  <a class="add-wishlist inProd added"
				data-action-is-add="0"
				data-action-add-url="{FAVORITES_ADD_URL}"
				data-action-delete-url="{FAVORITES_DELETE_URL}"
				data-action-add-title="Добавить в избранное"
				data-action-delete-title="Убрать из избранного"
				title="Убрать из избранного"
				data-msgtype="2"
				data-gname="{GOODS_NAME}"
				data-action-text-add="Добавить в избранное"
				data-action-text-delete="Удалить из избранного"
				href="{FAVORITES_DELETE_URL}?id={GOODS_MOD_ID}&amp;return_to={CURRENT_URL | urlencode}"
			  >Удалить из избранного</a>
			{% ELSE %}
			  <a class="add-wishlist inProd"
				data-action-is-add="1"
				data-action-add-url="{FAVORITES_ADD_URL}"
				data-action-delete-url="{FAVORITES_DELETE_URL}"
				data-action-add-title="Добавить в избранное"
				data-action-delete-title="Убрать из избранного"
				data-msgtype="2"
				data-gname="{GOODS_NAME}"
				data-action-text-add="Добавить в избранное"
				data-action-text-delete="Удалить из избранного"
				title="Добавить в избранное" href="{FAVORITES_ADD_URL}?id={GOODS_MOD_ID}&amp;return_to={CURRENT_URL | urlencode}"
			  >Добавить в избранное</a>
			{% ENDIF %}
		  </li>

далее после:
<div class="add-to-cart clear">
						<input type="hidden" name="form[goods_mod_id]" value="{GOODS_MOD_ID}" class="goodsDataMainModificationId" />
						<input type="button" value="В корзину" class="add-cart button btn-cart" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
						 <!--input type="button" value="Быстрый заказ" class="add-cart quick button btn-cart" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/-->
						<input type="button" value="Купить" class="button btn-cart quickview" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
				

вставьте:
<ul class="add-to-links clear">
		  <li class="wishlist">
			<!-- Если есть возможность добавить товар в избранное -->
			{% IF GOODS_MOD_IS_HAS_IN_FAVORITES_LIST %}
			  <a class="add-wishlist inProd added"
				data-action-is-add="0"
				data-action-add-url="{FAVORITES_ADD_URL}"
				data-action-delete-url="{FAVORITES_DELETE_URL}"
				data-action-add-title="Добавить в избранное"
				data-action-delete-title="Убрать из избранного"
				title="Убрать из избранного"
				data-msgtype="2"
				data-gname="{GOODS_NAME}"
				data-action-text-add="Добавить в избранное"
				data-action-text-delete="Удалить из избранного"
				href="{FAVORITES_DELETE_URL}?id={GOODS_MOD_ID}&amp;return_to={CURRENT_URL | urlencode}"
			  >Удалить из избранного</a>
			{% ELSE %}
			  <a class="add-wishlist inProd"
				data-action-is-add="1"
				data-action-add-url="{FAVORITES_ADD_URL}"
				data-action-delete-url="{FAVORITES_DELETE_URL}"
				data-action-add-title="Добавить в избранное"
				data-action-delete-title="Убрать из избранного"
				data-msgtype="2"
				data-gname="{GOODS_NAME}"
				data-action-text-add="Добавить в избранное"
				data-action-text-delete="Удалить из избранного"
				title="Добавить в избранное" href="{FAVORITES_ADD_URL}?id={GOODS_MOD_ID}&amp;return_to={CURRENT_URL | urlencode}"
			  >Добавить в избранное</a>
			{% ENDIF %}
   </li></ul>


#35 tanch

tanch

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 300 сообщений
  • ГородНовосибирск

Отправлено 12 Февраль 2016 - 01:39

Просмотр сообщенияVaccina (12 Февраль 2016 - 01:10) писал:


1. Кнопку "Добавить в избранное" хотелось бы поместить справа от "В корзину". Туда, где раньше было "Быстрый заказ". Возможно ли это?
2. Всплывающее окно всё же вытягивается, проверила в трёх браузерах
3. Подскажите - как в всплывающее окно добавить текст-ссылку ниже картинки

#36 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 12 Февраль 2016 - 01:56

1. Код:
<ul class="add-to-links clear">
				  <li class="wishlist">

замените на:
<ul class="add-to-links">
				  <li class="wishlist">

в main.css найдите:
.product-shop .add-to-links {
	list-style: none;
	margin: 0;
	padding: 0;
	display: block;
	padding-top: 20px;
}

после него пропишите:
.add-to-cart .add-to-links {
	float: left;
	margin-top: -15px;
	margin-left: 20px;
}
.product-shop .add-to-cart .btn-cart {
	float: left;
}

2. Код:
<script>
$(document).ready(function() {
$("a#size-page").fancybox({
maxWidth : 600,
maxHeight : 390,
fitToView : false,
width : '70%',
content: '<img src=http://st.larec-ledenec.ru/7/1820/793/repost.jpg>',
autoSize : false,
closeClick : false,
openEffect : 'none',
closeEffect : 'none'
});
});
</script>

замените на:
<script>
$(document).ready(function() {
$("a#size-page").fancybox({
maxWidth : 600,
fitToView : false,
width : '70%',
height : 'auto',
content: '<img src=http://st.larec-ledenec.ru/7/1820/793/repost.jpg>',
autoSize : false,
closeClick : false,
openEffect : 'none',
closeEffect : 'none'
});
});
</script>

3. Код:
content: '<img src=http://st.larec-ledenec.ru/7/1820/793/repost.jpg>',

замените на:
content: '<img src=http://st.larec-ledenec.ru/7/1820/793/repost.jpg /><br/><a href="ссылка">Текст</a>',

и замените необходимые значения

#37 tanch

tanch

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 300 сообщений
  • ГородНовосибирск

Отправлено 12 Февраль 2016 - 02:30

Просмотр сообщенияVaccina (12 Февраль 2016 - 01:56) писал:


Отлично! Всё получилось.
Единственное - ниже есть текст (страница товара), при наведении на него срабатывает наше всплывающее окно
04.jpg

И ещё вопросик (на другом шаблоне исправляла это, но не могу сейчас найти как):
В тексте ссылки никак не выделяются (синим с подчеркиванием), их не заметно!
Это и на странице товара и на любой странице вообще

#38 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 12 Февраль 2016 - 02:50

Скорее всего проблема в синтаксисе, ранее не заметила у вас, код:
<a href="http://st.larec-ledenec.ru/7/1820/793/repost.jpg" id="size-page"><img src=http://st.larec-ledenec.ru/9/1820/866/repost-button.jpg</a>

замените на:
<a href="http://st.larec-ledenec.ru/7/1820/793/repost.jpg" id="size-page"><img src=http://st.larec-ledenec.ru/9/1820/866/repost-button.jpg /></a>

На счет выделения ссылок, как вариант, можете изменить общие стили ссылок в main.css в следующем блоке:
a {color: #909090;text-decoration:none;cursor:pointer;}
a:hover, a:active {outline:0;color: #3cabda;text-decoration:none;}


#39 tanch

tanch

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 300 сообщений
  • ГородНовосибирск

Отправлено 12 Февраль 2016 - 03:16

Просмотр сообщенияVaccina (12 Февраль 2016 - 02:50) писал:

Спасибо!
Заметила еще проблему:
После перезагрузке страницы - всплывающее окно открывается неверного размера
если его закрыть и открыть заново, то всё в порядке
05.jpg

#40 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 12 Февраль 2016 - 03:21

Уточните пожалуйста браузер, в котором вы проверяете работу всплывающего окна?  В mozilla всплывающее окно подстраивается под контент.




Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных