溫馨提示×

您好，登錄后才能下訂單哦！

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》

weebox彈出窗口不居中顯示怎么辦

發(fā)布時(shí)間：2021-06-29 13:40:05 來源：億速云 閱讀：150 作者：小新 欄目：web開發(fā)

這篇文章主要介紹了weebox彈出窗口不居中顯示怎么辦，具有一定借鑒價(jià)值，感興趣的朋友可以參考下，希望大家閱讀完這篇文章之后大有收獲，下面讓小編帶著大家一起了解一下。

某些頁面weebox彈出窗口不居中顯示，某些頁面又居中顯示，彈出窗口的居中算法也OK，這是為什么呢？

一、解決辦法

作為對(duì)你負(fù)責(zé)的態(tài)度，必須先告知你決絕辦法。

在頁面頂端加入以下代碼：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

注意必須是這樣的

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ include file="/components/common/taglib.jsp"%>
<%@ include file="/components/common/jscsslib.jsp"%>

<head>

而不能是這樣的

<html xmlns="http://www.w3.org/1999/xhtml">

<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ include file="/components/common/taglib.jsp"%>
<%@ include file="/components/common/jscsslib.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>

二、錯(cuò)誤分析

jquery weebox總結(jié)中介紹了weebox的基本使用方法，那么對(duì)于weebox彈出框不居中顯示的原因，首先我們必須來先看看其setCenterPosition居中算法是否合理。

this.setCenterPosition = function() {
 var wnd = $(window), doc = $(document),
  pTop = doc.scrollTop(), pLeft = doc.scrollLeft(),
  minTop = pTop; 

 pTop += (wnd.height() - self.dh.height()) / 2;
 pTop = Math.max(pTop, minTop);
 pLeft += (wnd.width() - self.dh.width()) / 2;
 self.dh.css({top: pTop, left: pLeft});

}

發(fā)現(xiàn)算法還是非常ok的，不過請(qǐng)注意doc = $(document)。
前文我也告訴你了weebox不居中顯示的解決辦法，那么究竟原因關(guān)聯(lián)在哪里呢？

聲明必須是 HTML 文檔的第一行，位于 標(biāo)簽之前。
聲明不是 HTML 標(biāo)簽；它是指示 web 瀏覽器關(guān)于頁面使用哪個(gè) HTML 版本進(jìn)行編寫的指令。
在 HTML 4.01 中， 聲明引用 DTD，因?yàn)?HTML 4.01 基于 SGML。DTD 規(guī)定了標(biāo)記語言的規(guī)則，這樣瀏覽器才能正確地呈現(xiàn)內(nèi)容。

雖然這段話也并不能直接表明doctype和窗口居中之間的關(guān)系，但從解決辦法中可以猜測(cè)到，如果不指定 ，那么窗口在計(jì)算document的寬高時(shí)就不是標(biāo)準(zhǔn)的像素值，這就間接的導(dǎo)致彈出窗口的x、y坐標(biāo)沒有定位準(zhǔn)確。

感謝你能夠認(rèn)真閱讀完這篇文章，希望小編分享的“weebox彈出窗口不居中顯示怎么辦”這篇文章對(duì)大家有幫助，同時(shí)也希望大家多多支持億速云，關(guān)注億速云行業(yè)資訊頻道，更多相關(guān)知識(shí)等著你來學(xué)習(xí)!

向AI問一下細(xì)節(jié)

免責(zé)聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱：is@yisu.com進(jìn)行舉報(bào)，并提供相關(guān)證據(jù)，一經(jīng)查實(shí)，將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI
助
手