jQuery Mobile 是一種基於 Web 的技術,為網頁構建了出色的 UI 接口,可用於為可在所有類型的智能手機、平板電腦和台式機上訪問的網站製作響應式內容。
在本文中,我們將使用jQuery Mobile 彈出容差選項設置彈出窗口相應邊距窗口或頁麵邊的最小距離。“30,15,30,15”是默認的容差值。
這些值可以通過四種方式指定:
- 空字符串,null。
- 一個數字。
- 兩個逗號分隔的數字。
- 四個逗號分隔的數字。
用法:該參數以above-specified的方式取值。
$( ".selector" ).popup({ tolerance: "0,0" });
-
語法為獲取默認值選項。
var tolerance = $( ".selector" ).popup( "option", "tolerance" );
-
語法為設置默認值選項。
$( ".selector" ).popup( "option", "tolerance", "0,0" );
CDN 鏈接:以下是您的項目中需要的 jQuery Mobile 腳本,因此請將這些腳本添加到您的項目中。
<link rel=”stylesheet” href=”https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css” />
<script src=”https://code.jquery.com/jquery-1.11.1.min.js”></script>
<script src=”https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js”></script>
例子:這個例子說明了使用jQuery Mobile 彈出容差選項.
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible"
content="IE=edge" />
<meta name="viewport"
content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet"
href=
"https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
<script src=
"https://code.jquery.com/jquery-1.11.1.min.js">
</script>
<script src=
"https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js">
</script>
</head>
<body>
<center>
<h1 style="color:green;">GeeksforGeeks</h1>
<h3>jQuery Mobile Popup tolerance Option</h3>
<div role="main" class="ui-content">
<a href="#divID" data-rel="popup">
GeeksforGeeks
</a>
<div data-role="popup" id="divID"
data-tolerance="30,15,30,15"
data-theme="b">
<p>
A Computer Science portal for geeks.
</p>
</div>
</div>
<input type="button" id="Button"
width="50%"
value="Value of the tolerance option">
<h3><span id="gfg"></span></h3>
</center>
<script>
$(document).ready(function () {
$("#Button").on('click', function () {
var tolerance = $( "#divID" ).popup( "option", "tolerance" );
$("#gfg").html(tolerance);
});
});
</script>
</body>
</html>
輸出:
jQuery Mobile 彈出容差選項
參考: https://api.jquerymobile.com/popup/#option-tolerance
相關用法
- jQuery Mobile Popup disable()用法及代碼示例
- jQuery Mobile Popup option()用法及代碼示例
- jQuery Mobile Popup enable()用法及代碼示例
- jQuery Mobile Popup reposition()用法及代碼示例
- jQuery Mobile Popup destroy()用法及代碼示例
- jQuery Mobile Popup open()用法及代碼示例
- jQuery Mobile Popup close()用法及代碼示例
- jQuery Mobile Popup afteropen用法及代碼示例
- jQuery Mobile Popup classes用法及代碼示例
- jQuery Mobile Popup initSelector用法及代碼示例
- jQuery Mobile Popup beforeposition用法及代碼示例
- jQuery Mobile Popup defaults用法及代碼示例
- jQuery Mobile Popup create用法及代碼示例
- jQuery Mobile Popup afterclose用法及代碼示例
- jQuery Mobile Pagecontainer load()用法及代碼示例
- jQuery Mobile Pagecontainer getActivePage()用法及代碼示例
- jQuery Mobile Page bindRemove()用法及代碼示例
- jQuery Mobile Page setContainerBackground()用法及代碼示例
- jQuery Mobile Page removeContainerBackground()用法及代碼示例
- jQuery Mobile Page keepNativeSelector()用法及代碼示例
- jQuery Mobile Pagecontainer change()用法及代碼示例
- jQuery Mobile Page create用法及代碼示例
- jQuery Mobile Page beforecreate用法及代碼示例
- jQuery Mobile Pagecontainer changefailed用法及代碼示例
- jQuery Mobile Page closeBtnText用法及代碼示例
注:本文由純淨天空篩選整理自SHUBHAMSINGH10大神的英文原創作品 jQuery Mobile Popup tolerance Option。非經特殊聲明,原始代碼版權歸原作者所有,本譯文未經允許或授權,請勿轉載或複製。