![](https://img-blog.csdnimg.cn/20201014180756757.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
js
文章平均质量分 66
w-serendipity
这个作者很懒,什么都没留下…
展开
-
js获取页面元素距离浏览器工作区顶端的距离
js获取页面元素距离浏览器工作区顶端的距离先介绍几个属性:(暂时只测了IE和firefox,实际上我工作中用到的最多的是chrome)网页被卷起来的高度/宽度(即浏览器滚动条滚动后隐藏的页面内容高度)(javascript) document.documentElement.scrollTop //firefox(javascript) document.documentElement.scrollLeft //firefox(javascript) do转载 2021-10-12 16:35:52 · 1845 阅读 · 0 评论 -
js实现多个列表展开收缩类似手风琴效果
实现效果大概是多个卡片默认均隐藏详情部分,点击展开可查看该卡片详情,点击收起详情隐藏;同时只展开一个,即某个展开时其他的均收缩状态。设计思路:详情模块与展开按钮各设置两个样式类,即默认样式类与展开样式类。每个卡片默认样式类display:none,展开按钮默认样式不设置旋转角度。点击展开按钮后,通过js语句定位到使用展开类名的元素的位置,利用arrt方法将样式类名换为默认样式类,用同样的方法更改展开按钮的样式;将当前卡片及展开按钮的样式该改为展开样式类(通过设置按钮元素css-transform的旋转原创 2021-10-12 16:13:29 · 2717 阅读 · 2 评论 -
js实现导航条置顶
实现的效果大概是,滚动条往下滚动至导航条被隐藏时,将导航条置顶;滚动条往上滚动至导航条出现时,回到原来位置。大致逻辑是先获取导航条距离页面顶部的高度,滚动条滚动时,动态获取页面被卷起的高度;将导航条距离页面顶部的距离与页面被卷起的高度作比较。html代码 <div id="nav" style="width: 1200px;max-height: 100px"> <div>导航条内容</div> </div>js代码原创 2021-10-12 14:56:48 · 1065 阅读 · 0 评论