Модератор форума: JonMagon |
Сообщество uCoz » Вебмастеру » JavaScript, Flash и прочие технологии » jQuery » Cкрипт обратного звонка (помогите сделать скрипт обратного звонка в виде блока) |
Cкрипт обратного звонка |
$Vladimir$, а куда вставлять css?
Добавлено (08 Июн 2015, 19:44:52) |
sharyga, код для вызова почтовой формы $MFORM_2$. По указанной ссылке, в материале, вставлен html код. В первом контейнере форма работает корректно.
|
Мне нужно в шапке сайта сделать два всплывающих окна с разными почтовыми формами.Как это реализовать?
|
Likstanislav,
1. Создайте две почтовые формы и получите их код, допустим, $MFORM_2$ и $MFORM_3$ 2. Разместите в шаблоне нижней части сайта следующий код Код <div id="mform-1" style="display:none">$MFORM_2$</div> <div id="mform-2" style="display:none">$MFORM_3$</div> Код <a href="#" onclick="$.fancybox('#mform-1');return false;">Заказать звонок 1</a> <a href="#" onclick="$.fancybox('#mform-2');return false;">Заказать звонок 2</a> |
Ссылка на вызов окна <a title="Обратная связь" href="javascript:;" onclick="openchat();"><img src="/callback.png" alt="" border="0"></a> само окно <!--<Обратная связь>--> <script type="text/javascript"> function openchat(){new _uWnd('chat','Обратная связь',500,500,{align:0,shadow:0,close:1,autosize:1,maxh:600,minh:300,modal:1,resize:0,nomove:1}, $("#chat").html() )} </script> <div style="display:none;" id="chat">$MFORM_1$</div> <!--</Обратная связь>--> Попробовал Ваш вариант. Есть один нюанс: после того, как человек нажимает "Отправить", ему приходится закрывать 2 окна: "Сообщение отправлено" и "Форму отправки сообщения", но логично было бы, чтобы после отправки запроса, форма закрывалась автоматически. Нажимаешь отправить, выскакивает окно "Сообщение отправлено", закрываешь его и все. |
«ShaGun», все в ваших руках. Добавляйте нужный скрипт на окно уведомления, в зависимости от желаемого результата. Пример автозакрытия: Код <script type="text/javascript">setTimeout('location="/index/0-3/";', 1000);</script> 1000 = время Пример с нажатие на кнопку: Код <FORM> <input TYPE="button" VALUE="Нажать нежно" ONCLICK="ReloadButton()"> <script> function ReloadButton() { location.href="/"; } </script> </FORM> |
$Vladimir$, честно говоря, джаву совсем не знаю, поэтому и обратился)
Как я понял, в этом скрипте закрытие формы происходит через заданное количество времени. Но этот вариант не подходит - если задать слишком большое время, то покупатель будет смотреть на это окно, пока оно не закроется, а что вероятнее, сам закроет. И если задать слишком маленькое время, то не успеет заполнить данные и отправить.3 Не подскажете код для закрытия формы, в зависимости от нажатия кнопки "Отправить"? Добавлено (26 Июл 2016, 11:34:38) |
sergeymitrichev, спасибо за отличное решение! Подскажите, а как быть с pda версией сайта? Для мобильной версии это не работает - окно не открывается, а просто обновляется страница.
1. Создайте две почтовые формы и получите их код, допустим, $MFORM_2$ и $MFORM_3$2. Разместите в шаблоне нижней части сайта следующий код <div id="mform-1" style="display:none">$MFORM_2$</div> <div id="mform-2" style="display:none">$MFORM_3$</div>1 2 3. В шапке сайта разместите ссылки, по нажатию которых будет открываться окно с формой <a href="#" onclick="$.fancybox('#mform-1');return false;">Заказать звонок 1</a> <a href="#" onclick="$.fancybox('#mform-2');return false;">Заказать звонок 2</a> |
Sten1536, подключите библиотеку fancybox в PDA-шаблоны:
Код <link type="text/css" rel="stylesheet" href="/.s/src/ulightbox/ulightbox.css"> <script type="text/javascript" src="/.s/src/ulightbox/ulightbox.js"></script> |
sergeymitrichev, Огромнейшее спасибо! Но вылезла небольшая проблема. Всплывающее окно имеет фиксированный размер и на мобильном не помещается. Думаю, нужно создать в настройке дизайна почтовой формы создать 2 таблицы с почтовыми формами, одна из которых для обычной версии сайта, а вторая адаптирована под pda. И поставить их в переменные if. Вот только не могу найти код, по которому версии сайтов будут различаться. Подскажите пожалуйста как различить версии сайта, каким кодом для переменной if. Может с помощью ширины устройства?
|
Sten1536, можно взглянуть на страницу, где это происходит? можно для PDA версии стили скорректировать.
Сообщение отредактировал sergeymitrichev - Понедельник, 29 Авг 2016, 09:39:25
|
sergeymitrichev, http://stoyki-pro.com.ua/load....-1-0-73 Кнопка Купить.
Всплывающая таблица фиксированного размера, на экране телефона не помещается. Можно сделать ширину 100%, но там увеличенный шрифт, который на телефоне смотрится слишком крупно. Вот я и подумал сделать для пда отдельную таблицу почтовой формы. Или так не получится? |
Sten1536, может стоит отказаться от таблицы? оформите на дивах и не в две колонки, а в одну. Чтобы название поля и само поле были друг под другом:
Код Название поля: Поле для ввода текста |
sergeymitrichev, Возможно Вы правы. Спасибо за совет!
Мне тут еще несколько мыслей пришло в голову. 1. Если уже так оформлять, то можно в принципе сделать так, чтоб название поля уже было в поле для ввода текста, и когда заходишь в это поле, тот текст исчезает и вписываешь ту информацию, которую необходимо. Это можно реализовать? 2. Не удобно получается с сверху всплывающим окном, когда не правильно заполнил эл. адрес или не заполнил остальные поля для ввода. Можно вместо этого сверху накладывающегося окна сделать так, чтоб это предупреждение появлялось в нашем этом же окне почтовой формы вверху или внизу к примеру? Спрашиваю потому, что в опере мини не реально его закрыть. Приходится обновлять страницу. 3. И еще одна мысль. Когда нажимаешь на кнопку (в моем случае "Купить"), то сверху опять же накладывается окно с информацией что сообщение успешно отправлено и т.д. В итоге нужно закрывать это окно и саму почтовую форму. Можно сделать так, чтобы при нажатии кнопки, почтовая форма автоматически закрывалась? Чтобы нужно было закрыть только окно об успешной отправки сообщения. Извините что загрузил Вас, Сергей... Добавлено (29 Авг 2016, 23:11:02) Сообщение отредактировал Sten1536 - Понедельник, 29 Авг 2016, 23:07:19
|
Да, верно, это лучший вариант для Вашей задачи.
Согласен, но тут придется сильно перелопатить. Легче изменить дизайн всплывающих окон. Посмотрите тут готовые стили Можно сделать так, чтобы при нажатии кнопки, почтовая форма автоматически закрывалась? Код onclick="$.fancybox.close();" |
| |||