開始搞自提柜了，與Android配合一起整，還是第一次。
下面是與安卓的交互（從Android獲取數(shù)據(jù)）
// 安卓固定方法
function connectWebViewJavascriptBridge(callback) {
if (window.WebViewJavascriptBridge) {
callback(WebViewJavascriptBridge)
} else {
document.addEventListener(
'WebViewJavascriptBridgeReady',
function () {
callback(WebViewJavascriptBridge)
},
false
);
}
}
connectWebViewJavascriptBridge(function (bridge) {
bridge.init(function (message, responseCallback) {
if (responseCallback) {
responseCallback(data);
}
});
// 自己寫的方法
getcode()
})
function getcode(){
window.WebViewJavascriptBridge.callHandler(
'getgoodstype', {
'param': '中文測試'
},
function (responseData) {
// 這是從Android獲取到的參數(shù)
console.log(responseData)
}
)
}
期間遇到了一個需求，就是頁面中有個導航欄，向上滾動到一定位置后要吸頂。
之前沒有做過這種的，就在網(wǎng)上找了找。
這是我所看到的原創(chuàng)作者的分享
https://www.cnblogs.com/liyuhuan/p/7779626.html
我直接站出來給大家瞧瞧
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>js滾動到指定位置導航欄固定頂部</title>
<style type="text/css">
body {
height: 2500px;
margin: 0;
padding: 0;
}
.banner {
height: 250px;
width: 100%;
background: #e5e5e5;
}
.bignav {
width: 100%;
background: #000;
}
.nav {
background: #000;
width: 1200px;
margin: 0 auto;
height: 45px;
}
.nav a {
display: block;
width: 200px;
float: left;
color: #fff;
text-decoration: none;
text-align: center;
line-height: 45px;
}
</style>
</head>
<body>
<div class="banner">
</div>
<div class="bignav" id="bignav">
<div class="nav">
<a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow"
rel="external nofollow" rel="external nofollow">首頁</a>
<a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow"
rel="external nofollow" rel="external nofollow">首頁</a>
<a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow"
rel="external nofollow" rel="external nofollow">首頁</a>
<a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow"
rel="external nofollow" rel="external nofollow">首頁</a>
<a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow"
rel="external nofollow" rel="external nofollow">首頁</a>
<a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow"
rel="external nofollow" rel="external nofollow">首頁</a>
</div>
</div>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<p>其他內容</p>
<script type="text/javascript">
window.onscroll = function () {
var topScroll = get_scrollTop_of_body(); //滾動的距離,距離頂部的距離
var bignav = document.getElementById("bignav"); //獲取到導航欄id
if (topScroll > 250) { //當滾動距離大于250px時執(zhí)行下面的東西
bignav.style.position = 'fixed';
bignav.style.top = '0px';
bignav.style.zIndex = '9999';
} else { //當滾動距離小于250的時候執(zhí)行下面的內容，也就是讓導航欄恢復原狀
bignav.style.position = 'static';
}
}
/*解決瀏覽器兼容問題*/
function get_scrollTop_of_body() {
var scrollTop;
if (typeof window.pageYOffset != 'undefined') { //pageYOffset指的是滾動條頂部到網(wǎng)頁頂部的距離
scrollTop = window.pageYOffset;
} else if (typeof document.compatMode != 'undefined' && document.compatMode != 'BackCompat') {
scrollTop = document.documentElement.scrollTop;
} else if (typeof document.body != 'undefined') {
scrollTop = document.body.scrollTop;
}
return scrollTop;
}
</script>
</body>
</html>
以上js滾動到指定位置導航欄固定頂部的方法了
如果這篇文章對你有幫助，或者在進行中遇到其他問題，歡迎評論區(qū)留言出來。
我們一起探討~
