*、上司布置了一个新的任务,要展示一篇超出页面内容的段落文字,要实现隐藏多余部分且要看的时候再展示出来,(最好动态展示并且可以收缩的功能,注意实现动画效果)括号里是我自己加上去的,O(∩_∩)O哈哈~。
*、首先梳理下DIV高度变化知识点(其实已经完成了,就在附件里)
$("#divId").css("height");获取高度 $("#divId").css("height",val+"px");设置高度,注意px单位 ps:height只能实现一次最少+-(1)的最小单位,反正我尝试了是这样
*、接着开始操作height时发现了一个搞笑的事情,div的高度在变,可是当前页面不动,那能看到什么呢?呵呵,于是需要汲取下面的营养点
$(window).height();代表当前窗口的实际高度 $(document).height();代表当前页面文档且包含滚动上去的高度 $(document).scrollTop();代表当前滚动条距离整个文档顶端的高度 ps:那么? 是否到达顶端:$(document).scrollTop()<=0 是否到达底端:($(document).height()-$(window).height()-$(document).scrollTop())<=0
*、然后肯定不能人去每秒不间断的点击对吧,所以就要用到神奇的定时器了,可是发现关不掉,我倒,我也不知道问题出在哪里,于是用了下面的方法,ε=(´ο`*)))唉
对,没错,这次没有代码,哈哈 解决方法就是:在setInterval内部的function中添加状态,然后在某个特定状态下clearInterval(barName)即可 why?why?why?
*、附件中的代码还有很多地方待优化哈哈,有时间再钻进去看喽
比如根据内容的长度自动计算出div或其他容器的高度 比如自定义展开和收起的速度 比如定时器的关闭策略的优化 比如写成闭包提供给别人直接调用 ε=(´ο`*)))唉 要学习的还有好多,学习使我快乐,(*^▽^*)
*、一个搞数据专员的同事无意间看到我在调试,然后我说展开的时候不能准确的检测高度,所以会有课空白,他说那就换个方式不可以吗?比如瞬间全部展示,额~
其实我想过,也实现过了,height改成auto就哦了。 然后我就调成auto,测试了一把,虽然展示的时候(不知道怎么说,貌似也没什么影响哎) 于是乎,展开用瞬间,一行代码就哦了,收起的时候用动态的,真棒,哈哈 好景不长。。。 比如说领导说收起的时候要什么动画,多余,于是乎收起也变成瞬间的了。ε=(´ο`*)))唉 比如显示字数和定位高度的对应关系其实是有bug的,所以改呀。 -->然后就改成了截取的方式,截取又遇到标签截取一半的情况(定位到标签的每一个字符,然后特殊处理,比如重新定位截取地址) -->另外一个想法是:超过800字符进行截取,但是截取的坐标不是800而是600的位置,这样一来,可以保证展示的动作不至于出现只隐藏一两个字符的情况 -->截取的部分和整体部分交替显示,从而实现展开和收起的效果
相关推荐
那些年,与你同分同位次的同学都去了哪里?全国各大学在辽宁2020-2024年各专业最低录取分数及录取位次数据,高考志愿必备参考数据
2024嵌入式大厂面经50套大厂高频面试题资料
eclipaint-eclipse插件
该TemplateAppProject是一个基于XUI、XUtil、XAOP等框架构建的Android模版空壳工程,包含172个文件,涵盖68个Java源文件、64个XML配置文件、17个PNG图片文件、6个Gradle脚本文件、2个YAML配置文件、2个Git忽略文件、2个文本文件和1个Markdown文件。该工程集成了XPage、XUpdate和XHttp2等功能,旨在快速搭建Android应用开发环境。
IEA乌克兰的能源安全和即将到来的冬天-乌克兰及其合作伙伴的能源行动计划(英).pdf
UC-GUI文档uCGUI中文手册UC-GUI文档uCGUI中文手册
微信小程序反编译_ xapkg解包器
微信小程序婚礼邀请函_婚礼邀请函
该项目是一款基于Html和TypeScript构建的2B2C礼品购买平台源码,包含958个文件,涵盖196个TypeScript文件、145个Java文件、119个JPG图片、118个CSS文件、85个JavaScript文件、54个HTML文件、47个类文件、44个XML文件、26个PNG图片、23个Vue组件。该平台采用现代化前端技术,旨在提供一个流畅的礼品选购体验。
Fedora-Workstation-Live-x86_64-40-1.14.iso.008
那些年,与你同分同位次的同学都去了哪里?全国各大学在辽宁2020-2024年各专业最低录取分数及录取位次数据,高考志愿必备参考数据
Fedora-Workstation-Live-x86_64-40-1.14.iso.002
那些年,与你同分同位次的同学都去了哪里?全国各大学在辽宁2020-2024年各专业最低录取分数及录取位次数据,高考志愿必备参考数据
【作品名称】:基于Matlab的单水箱液位的模糊控制系统设计【含课程设计报告+程序】 【适用人群】:适用于希望学习不同技术领域的小白或进阶学习者。可作为毕设项目、课程设计、大作业、工程实训或初期项目立项。 【项目介绍】: 控制⽬标 控制⽬标:倒锥形容器的液位⾼度h=h0 检测装置:通过测量容器底部压⼒来间接测量液位 执⾏机构:控制进⽔电磁阀V1的开启度开启度 u ∈ [0, 90 ∘ ] 受控对象:模糊控制器最终影响倒锥形容器内的⽔量,所以受控对象是倒锥形容器 为简单起⻅,假设电磁阀V1的开启度与进⽔量间呈线性关系。所以控制进⽔量Qi实际上就是控制 电磁阀V1的开启度u。 因此对于整个系统⽽⾔,模糊控制器最终控制的是电磁阀V1的开启度u,从⽽控制倒锥形容器内 的⽔量。 注意:模糊控制器受控对象是倒锥形容器,其液位⾼度h和进⽔量Qi间的关系不是线性关系 电磁阀V2的开度固定,但出⽔量Qo与倒锥形容器的液位⾼ 【资源声明】:本资源作为“参考资料”而不是“定制需求”,代码只能作为参考,不能完全复制照搬。需要有一定的基础能够看懂代码,能够自行调试代码并解决报错,能够自行添加功能修改代码。
包含RMI服务所需的内容和测试使用的攻击FastJson1反序列化漏洞的Java文件
Wanandroid微信小程序w_x-Wanandroid
Fedora-Workstation-Live-x86_64-40-1.14.iso.005
全国大学生电子设计大赛项目合集全国电赛优秀作品STM32项目基于stm32和mpu9250的usbhid键盘,鼠标,游戏控制器
那些年,与你同分同位次的同学都去了哪里?全国各大学在辽宁2020-2024年各专业最低录取分数及录取位次数据,高考志愿必备参考数据
AutoLine是一个基于Python的通用自动化测试开源平台,包含了657个文件,涵盖228个PNG图片、209个CSS样式、95个JavaScript脚本、39个Python源代码、21个HTML文件、19个XML文件、14个GIF图片、6个DS_Store文件、5个文本文件、4个Markdown文件。该平台的设计源码由多种编程语言编写,旨在提供灵活高效的自动化测试解决方案。