javascript - 手機(jī)端怎么實(shí)現(xiàn)返回頂部效果呢?(手機(jī)端滾動(dòng)條會(huì)隱藏,無(wú)法檢測(cè))我用的sui 框架 a的錨點(diǎn)功能不能用,有沒(méi)有js方法?
問(wèn)題描述
如題,因?yàn)橛昧藄ui框架,a的錨點(diǎn)鏈接效果沒(méi)作用,雖然我禁用了路由功能,還是不行 請(qǐng)問(wèn)有沒(méi)有js方法實(shí)現(xiàn)返回頂部?或者哪位大神熟悉sui框架 我該怎么實(shí)現(xiàn)呢?
問(wèn)題解答
回答1://當(dāng)滾動(dòng)條的位置處于距頂部100像素以下時(shí),跳轉(zhuǎn)鏈接出現(xiàn),否則消失 $(function () {$(window).scroll(function () { if ($(window).scrollTop() > 100) {$('#back-to-top').fadeIn(1000);console.log($(window).scrollTop())console.log(window.innerHeight) } else {$('#back-to-top').fadeOut(1000); }});//當(dāng)點(diǎn)擊跳轉(zhuǎn)鏈接后,回到頁(yè)面頂部位置$('#back-to-top').click(function () { $(’body,html’).animate({scrollTop: 0}, 1000); return false;}); });
我寫了小demo 明明就可以觸發(fā)
<!DOCTYPE html><html lang='en'><head> <meta charset='UTF-8'> <title>Title</title> <meta name='viewport' content='width=device-width,user-scalable=no,initial-scale=1.0'/> <meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'/> <meta name='keywords' content=''/> <meta name='description' content=''/> <meta name='robots' content='all'> <meta name='renderer' content='webkit'> <style>*{ margin: 0;padding: 0;} p{ width: 100%; height:1880px; background: #BDBDBD; }.fix{ width: 50px; height:50px; background: #B72712; position: fixed; right: 0; bottom: 50px; color: #ffffff; font-size: 18px; text-align: center; display: none;} </style></head><body><p id='p'> 我是主體內(nèi)容</p><p id='back-to-top'> 返回頂部</p></body><script src='http://www.4tl426be.cn/wenda/jquery.js'></script><script>$(function () { $(window).scroll(function () {if ($(window).scrollTop() > 100) { $('#back-to-top').fadeIn(1000); console.log($(window).scrollTop()) console.log(window.innerHeight)}else { $('#back-to-top').fadeOut(1000);} }); //當(dāng)點(diǎn)擊跳轉(zhuǎn)鏈接后,回到頁(yè)面頂部位置 $('#back-to-top').click(function () {$(’body,html’).animate({scrollTop: 0}, 1000);return false; });});</script></html>
