Google网站翻译脚本会干扰jquery对话框的左侧值

时间:2017-04-29 05:51:54

标签: jquery html jquery-ui google-translate google-translator-toolkit

Google网站翻译器脚本会干扰jquery对话框的左侧值。

加载屏幕时,对话框最初居中,然后向右推。 我不知道为什么会这样。 我可以在任何地方启动对话框吗?

这是示例代码。



<!DOCTYPE html>
<html>
<head>
	<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.3/jquery.min.js"></script>
	<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
	<script type="text/javascript">
		function googleTranslateElementInit() {
			new google.translate.TranslateElement({pageLanguage: 'en'}, 'google_translate_element');
		}
	</script>
	<script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
</head>

<body style="width:500px;margin:auto;">
<p>body comment~ body comment~ body comment~ body comment~ body comment~ body comment~ body comment~ body comment~ body comment~ body comment~ body comment~ body comment~ </p>

<div class="popup0_dialog" title="NOTICE">
	<p>This dialog box will be pushed right.</p>
</div>

<script type="text/javascript">
	$(document).ready(function () {
		// catation dialog 옵션
		$(".popup0_dialog").dialog({
			dialogClass: "popup0_dialog_class",
			position: {my: "center top ", at: "center top+100", of: "body"},
		});
	});

</script>

</div>
</body>
</html>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

来自其他社区的人告诉我答案。 谷歌网站翻译使得机构有位置:相对。 通过在body元素下创建具有宽度值的新div,我可以解决这个问题。

如果您有任何其他好的解决方案,请告诉我。

<body>
    <div style="width:500px;margin:auto;">
        <p>body comment~ body comment~ body comment~ body comment~ body comment~ body comment~ body comment~ body comment~ body comment~ body comment~ body comment~ body comment~ </p>

        <div class="popup0_dialog" title="NOTICE">
            <p>This dialog box will be pushed right.</p>
        </div>
    </div>
</body>