Форум Сайтостроение Веб-строительство

Положение всплывающего окна

12
С8
На сайте с 23.08.2012
Offline
108
Сабрина87
1256

Здравствуйте! Столкнулась с проблемой, есть всплывающее окно "Заказать звонок", которое появляется при нажатии на соответствующую кнопку, но оно появляется на некоторых страницах как нужно - по центру экрана, а на некоторых - видна только его часть и располагается оно в углу экрана. Сайт на джумле, использовала готовый модуль mod_callback. Вот код, отвечающий за расположение окна:

<!-- validate-->
    <script language="javascript" type="text/javascript">
	function getClientWidth()
		{
			return document.compatMode=='CSS1Compat' && document.documentElement.clientWidth;
		}

		function getClientHeight()
		{
			return document.compatMode=='CSS1Compat' && document.documentElement.clientHeight;
		}

		var top_block = Math.round((getClientHeight() + 670) / 2);
		var left_block = Math.round((getClientWidth() + 1490) / 2);
		
    	jQuery(function(){
    		jQuery("#form_vopros").animate({ marginLeft: left_block, marginTop: top_block}, 0 );
    		//jQuery("#form_border").animate({ opacity: 0}, 0 );
    		
    		jQuery("#close_callback").click(function(){
				jQuery("#form_vopros").hide( 0, function(){
						jQuery("#form_border").animate({
						opacity: 1.0
						}, 0, function(){
							jQuery("#form_border").animate({
							opacity: 0.0, marginLeft: 19, marginTop: 19, width: "29px", height: "33px"
							}, 500, function() { jQuery("#layer_form").hide() } );
						} );
					}
				);
			});
    	
			
			jQuery("#show_callback").click(function(){
				jQuery("#layer_form").show();
				jQuery("#form_border").animate({
					opacity: 1.0, marginLeft: left_block+19, marginTop: top_block+19, width: "249px", height: "290px"
					}, 500, function(){
						jQuery("#form_border").animate({
						opacity: 0.0
						}, 0, function(){
							jQuery("#form_vopros").show();
						} );
					}
				);
			});
		});
        function checkForm()
        {
        	var form = document.feedback_form;

           if (form.name.value == "")
           {
                 alert( '<?php echo JText::_('modcallback_enter_your_name') ?>' );
                 form.name.focus();
                 return false;
           }
           if (form.phone.value == "")
           {
                 alert( '<?php echo JText::_('modcallback_enter_your_phone') ?>' );
                 form.phone.focus();
                 return false;
           }
           return true;
        }
        </script>
     <!-- end validate-->
DD
На сайте с 20.05.2010
Offline
54
DmitriyDonetsk
#1

Сайт на локалхосте, или можете ссылку сбросить?

Изготовление сайтов (CMS Joomla, Wordpress) ( https://searchengines.guru/ru/forum/861077 )
D
На сайте с 14.01.2007
Offline
153
Dinozavr
#2 


    
    		var top_block = Math.round(($(window).height() - 330) / 2);
    		var left_block = Math.round(($(window).width() - 288) / 2);
    		
        	jQuery(function(){
        		jQuery("#form_vopros").animate({ marginLeft: left_block, marginTop: top_block}, 0 );
        		//jQuery("#form_border").animate({ opacity: 0}, 0 );
        		
        		jQuery("#close_callback").click(function(){
    				jQuery("#form_vopros").hide( 0, function(){
    						jQuery("#form_border").animate({
    						opacity: 1.0
    						}, 0, function(){
    							jQuery("#form_border").animate({
    							opacity: 0.0, marginLeft: 19, marginTop: 19, width: "29px", height: "33px"
    							}, 500, function() { jQuery("#layer_form").hide() } );
    						} );
    					}
    				);
    			});

попробуйте

С8
На сайте с 23.08.2012
Offline
108
Сабрина87
#3

Могу, сейчас, если заходить с главной, контактов, аниматоров, все ОК, если с ведущих, фокусника, и прочее - находится в правом нижнем углу. Вот ссылка http://karusel-ufa.ru/, он еще не доделан).

---------- Добавлено 03.07.2014 в 11:33 ----------

Попробовала, теперь окно появляется с главной по центру, с остальных страниц его вообще нет...

---------- Добавлено 03.07.2014 в 11:35 ----------

А может быть, можно убрать вообще эти вычисления, и прописать в стилях конкретную позицию #layer_form ?

Bing добавил на главную В каталоге навыков для Bing обновил поисковые приложения
D
На сайте с 14.01.2007
Offline
153
Dinozavr
#4
Сабрина87:
А может быть, можно убрать вообще эти вычисления, и прописать в стилях конкретную позицию #layer_form ?

можно, но тогда он будет не посередине.

И зачем вы минус на плюс поменяли?

С8
На сайте с 23.08.2012
Offline
108
Сабрина87
#5

Да я верстку полностью переделывала, звонок почему-то сместился, поэтому поменяла. Но я пробовала и с минусом - такая же проблема.

---------- Добавлено 03.07.2014 в 12:08 ----------

Не подскажете, какую именно часть кода можно убрать, я убирала - вообще ничего не появлялось. А посередине форму поставить, думаю, можно будет, если спозиционировать относительно родителя?

Яндекс Директ обновил настройки Андрей Кармацкий о дизайне Островной интерфейс выдачи Яндекса
D
На сайте с 14.01.2007
Offline
153
Dinozavr
#6
Сабрина87:
А посередине форму поставить, думаю, можно будет, если спозиционировать относительно родителя?

у вас родительский элемент такой же как и окно





function getClientWidth() {
    var w = window;
    d = document;
    e = d.documentElement;
    g = d.getElementsByTagName('body')[0];
    return w.innerWidth || e.clientWidth || g.clientWidth;
}

function getClientHeight() {
    var w = window;
    d = document;
    e = d.documentElement;
    g = d.getElementsByTagName('body')[0];
    return w.innerHeight|| e.clientHeight|| g.clientHeight;;
}

var top_block = Math.round((getClientHeight() - 390) / 2);
var left_block = Math.round((getClientWidth() - 400) / 2);

jQuery(function () {
    jQuery("#form_vopros").animate({ marginLeft: left_block, marginTop: top_block}, 0);
    //jQuery("#form_border").animate({ opacity: 0}, 0 );

    jQuery("#close_callback").click(function () {
        jQuery("#form_vopros").hide(0, function () {
                jQuery("#form_border").animate({
                    opacity: 1.0
                }, 0, function () {
                    jQuery("#form_border").animate({
                        opacity: 0.0, marginLeft: 19, marginTop: 19, width: "29px", height: "33px"
                    }, 500, function () {
                        jQuery("#layer_form").hide()
                    });
                });
            }
        );
    });


    jQuery("#show_callback").click(function () {
        jQuery("#layer_form").show();
        jQuery("#form_border").animate({
                opacity: 1.0, marginLeft: left_block + 19, marginTop: top_block + 19, width: "249px", height: "290px"
            }, 500, function () {
                jQuery("#form_border").animate({
                    opacity: 0.0
                }, 0, function () {
                    jQuery("#form_vopros").show();
                });
            }
        );
    });
});
<!-- end validate-->

С8
На сайте с 23.08.2012
Offline
108
Сабрина87
#7

Когда нажимаешь кнопку на страницу http://karusel-ufa.ru/index.php/fotootcheti - все нормально, но когда заходишь дальше http://karusel-ufa.ru/index.php/fotootcheti/16-den-rozhdeniya-kati - вплывающее окно съезжает. И так во всех разделах.

D
На сайте с 14.01.2007
Offline
153
Dinozavr
#8

попробуйте всё-таки мою последнюю версию

С8
На сайте с 23.08.2012
Offline
108
Сабрина87
#9

Попробовала последнюю вашу версию, теперь когда заходишь c http://karusel-ufa.ru/index.php/fotootcheti окно вверху немного влево (верх немного не влезает), а при нажатии на http://karusel-ufa.ru/index.php/fotootcheti/16-den-rozhdeniya-kati - окно расположено почти там, где надо, но немного правее.

D
На сайте с 14.01.2007
Offline
153
Dinozavr
#10

на обоих страницах ваша версия.

И у меня там ошибка была, попробуйте сейчас

12

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий