網(wǎng)站建設(shè)開發(fā)移動端彈窗彈出后手機物理返回關(guān)閉彈窗不跳轉(zhuǎn)頁面
css:
<style>
.popup {
display: none;
position: fixed;
z-index: 1000;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
background-color: #000000;
}
.btn {
margin: 100px auto;
width: 100px;
height: 40px;
line-height: 38px;
border-radius: 25px;
text-align: center;
border: 1px solid green;
cursor: pointer;
}
</style>
html:
<body>
<div class="popup">
</div>
<div class="btn">彈窗</div>
</body>
js:
<!-- 引入JQ -->
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script>
// 拉起彈窗
$(".btn").click(function () {
$(".popup").fadeIn();
pushHistory();
})
//拉起彈窗后手機物理返回操作關(guān)閉彈窗，彈窗出現(xiàn)時執(zhí)行'pushHistory'函數(shù),獲取地址
function pushHistory() {
var state = {
title: "title",
url: "#"
};
window.history.pushState(state, "title");
}
// 監(jiān)聽手機物理返回
window.addEventListener("popstate", function (e) {
// 判斷彈窗是否顯示
if ($(".popup").css('display') == "block") {
$(".popup").fadeOut();
} else {
history.back()
}
}, false);
</script>
彈窗時執(zhí)行函數(shù)pushHistory();即可做到移動端彈窗彈出是物理返回關(guān)閉彈窗不跳轉(zhuǎn)頁面
我們從以下三個方面，對比純靜態(tài)和偽靜態(tài)兩種靜態(tài)頁面生成方式，逐一展開分析。
用JS的正則表達式如何判斷輸入框內(nèi)為中文或者是英文數(shù)字，或者是三者混編
css制作扇形
純CSS3文字Loading動畫特效
PhpStorm 2022.1 EAP 3 在 PHPDoc 和屬性中添加了對多行和嵌套數(shù)組形狀的完全支持：在這種情況下，可以使用數(shù)組形狀注釋定義數(shù)組結(jié)構(gòu)，以獲得鍵的代碼補全并推斷值的類型。
PHP作為Web界第一大語言近年來熱度不夠，但是這幾年的進步和成長卻沒有中斷。在2022伊始，我們來一起學(xué)習(xí)一下目前PHP的現(xiàn)狀以及最新版本帶來的特性。
Linux程序前臺后臺切換：在Linux終端運行命令的時候，在命令末尾加上 & 符號，就可以讓程序在后臺運行Ubuntu$">root@Ubuntu$ ./tcpserv01 &
Python 的正則表達式支持 多行模式，將每行文字分別匹配。然而各種操作系統(tǒng)里，換行符的表示法各不相同，會導(dǎo)致 Python 不能正確使用多行模式。