关于jQuery中fade(),show()起始位置的一点小发现


Posted in jQuery onApril 25, 2017

最近在鼓弄主页的时候想要添加一个音乐播放的插件,暂时使用网易与音乐外链播放器,效果是在右下角弹出和消失,于是问题来了:

show()和fade()函数是用来显示或者隐藏元素的函数,可以为其传入时间参数,使得函数在多少毫秒内完成。

但是出现和消失的起始点在哪里呢?

默认的话,是左上角:

关于jQuery中fade(),show()起始位置的一点小发现

但是有的时候要设置元素出现的位置,比如我想让元素以右下角为起始位置,怎么做呢?

我也是否然发现但不确定是否是隐藏属性,就是我为元素设置了如下样式:

aside{
  position: fixed;
  bottom:65px;
  right:20px;
}

如此以来,元素就会以“右下角”作为出现和消失的基准点:

关于jQuery中fade(),show()起始位置的一点小发现

但是这种效果只在为元素设置position属性为fixed或者absolute时才有效果,其它时候没效果?

我认为具体实现就需要翻看源码了,哪位同仁搞清楚这个机制的话,欢迎评论或者私信,个人造诣不够。

另外,跪求一个录制gif的软件,也看到了,上面的动图效果是多么的差,至于比较广泛的GifCam软件,我这里录制出来的会变黑。。好吧,难道是要换电脑了吗???

以上这篇关于jQuery中fade(),show()起始位置的一点小发现就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

jQuery 相关文章推荐
jquery dataTable 获取某行数据
May 05 jQuery
jQuery用户头像裁剪插件cropbox.js使用详解
Jun 07 jQuery
jQuery复合事件用法示例
Jun 10 jQuery
jQuery实现的简单动态添加、删除表格功能示例
Sep 21 jQuery
原生JS与jQuery编写简单选项卡
Oct 30 jQuery
jQuery实现form表单序列化转换为json对象功能示例
May 23 jQuery
详解jQuery中的easyui
Sep 02 jQuery
jQuery的ztree仿windows文件新建和拖拽功能的实现代码
Dec 05 jQuery
jQuery事件多次绑定与解绑问题实例分析
Feb 19 jQuery
jQuery子选择器与可见性选择器实例分析
Jun 28 jQuery
jquery将json转为数据字典的实例代码
Oct 11 jQuery
基于jQuery实现可编辑的表格
Dec 11 jQuery
jquery submit()不能提交表单的解决方法
Apr 24 #jQuery
jquery实现异步加载图片(懒加载图片一种方式)
Apr 24 #jQuery
使用jQuery ajaxupload插件实现无刷新上传文件
Apr 23 #jQuery
jQuery实现百度登录框的动态切换效果
Apr 21 #jQuery
推荐三款日期选择插件(My97DatePicker、jquery.datepicker、Mobiscroll)
Apr 21 #jQuery
jquery中$.fn和图片滚动效果实现的必备知识总结
Apr 21 #jQuery
jQuery+pjax简单示例汇总
Apr 21 #jQuery
You might like
php防注
2007/01/15 PHP
实战mysql导出中文乱码及phpmyadmin导入中文乱码的解决方法
2010/06/11 PHP
php对称加密算法示例
2014/05/07 PHP
JavaScript 联动的无限级封装类,数据采用非Ajax方式,随意添加联动
2010/06/29 Javascript
js实现拉伸拖动iframe的具体代码
2013/08/03 Javascript
javascript的回调函数应用示例
2014/02/20 Javascript
教你如何自定义百度分享插件以及bshare分享插件的分享按钮
2014/06/20 Javascript
JavaScript的原型继承详解
2015/02/15 Javascript
深入理解JavaScript系列(36):设计模式之中介者模式详解
2015/03/04 Javascript
javascript检测两个数组是否相似
2015/05/19 Javascript
JavaScript如何实现组合列表框中元素移动效果
2016/03/01 Javascript
Bootstrap3学习笔记(三)之表格
2016/05/20 Javascript
easyui tree带checkbox实现单选的简单实例
2016/11/07 Javascript
详解Vue 非父子组件通信方法(非Vuex)
2017/05/24 Javascript
微信小程序 获取二维码实例详解
2017/06/23 Javascript
详解Vue-cli中的静态资源管理(src/assets和static/的区别)
2018/06/19 Javascript
微信小程序onLaunch异步,首页onLoad先执行?
2018/09/20 Javascript
vue3 源码解读之 time slicing的使用方法
2019/10/31 Javascript
Django静态资源URL STATIC_ROOT的配置方法
2014/11/08 Python
Python OpenCV处理图像之图像像素点操作
2018/07/10 Python
python 通过类中一个方法获取另一个方法变量的实例
2019/01/22 Python
使用Python给头像戴上圣诞帽的图像操作过程解析
2019/09/20 Python
sklearn-SVC实现与类参数详解
2019/12/10 Python
解决安装新版PyQt5、PyQT5-tool后打不开并Designer.exe提示no Qt platform plugin的问题
2020/04/24 Python
虚拟环境及venv和virtualenv的区别说明
2021/02/05 Python
HTML5离线应用与客户端存储的实现
2018/05/03 HTML / CSS
英国最大的线上保健品零售商之一:Vitamin Planet
2016/12/01 全球购物
交通安全教育制度
2014/02/02 职场文书
运动会入场式解说词
2014/02/18 职场文书
购房意向书
2014/04/01 职场文书
李开复演讲稿
2014/05/24 职场文书
纺织工程专业推荐信
2014/09/08 职场文书
学习与创新自我评价
2015/03/09 职场文书
党课主持词大全
2015/06/30 职场文书
感恩老师主题班会
2015/08/12 职场文书
动画《平凡职业成就世界最强》宣布制作OVA
2022/04/01 日漫