侧边栏壁纸
  • 累计撰写 30 篇文章
  • 累计创建 40 个标签
  • 累计收到 3 条评论

J2EE学习

kiko
2020-09-10 / 0 评论 / 0 点赞 / 217 阅读 / 968 字
温馨提示:
本文最后更新于 2022-02-26,若内容或图片失效,请留言反馈。部分素材来自网络,若不小心影响到您的利益,请联系我们删除。

J2EE 项目开发

校园即时通讯系统

技能点

  • 前后端分离技术能力
  • 前端框架技术
  • 前端插件
  • SSM框架
  • 数据安全技术
  • 数据分析

使用bootstrap搭建前端页面

触底监听
<script type="text/javascript">
			$(function(){
				window.addEventListener("scroll",function(e){
					//当前滚动条的位置    >= (文档高度-窗口高度)
					if($(document).scrollTop() >= ($(document).height() - $(window).height())){
						console.log("触底了");
					}
				})
			})
</script>
返回顶部悬浮按钮

enter description here

html

<div class="goTop"><span class="glyphicon glyphicon-chevron-up" id="up" aria-hidden="true"></span></div>
.goTop{
			  position: fixed;
			  bottom: 10%;
			  right: 3%;
			  cursor: pointer;
			  width: 2.5rem;
			  height: 2.5rem;
			  display: none;
			}
<script>
			$(document).scroll(function() {
				var scroH = $(document).scrollTop(); //滚动高度
				if (scroH >= 100) { // 显示
					$('.goTop').css("display", "block") 
				} else { // 消失
					$('.goTop').removeAttr("style") 
				}
				// 点击事件 
				$('.goTop').click(function() {
					if (scroH != 0) {
						$('body,html').stop().animate({}).animate({ 
							scrollTop: '0px',
						}, 600);
						return false;
					}
				})
			});
</script>

0

评论区