随笔档案「2017年1月」 - 萤子

摘要：下面我想实现的效果是点击按钮显示和隐藏div，点击document隐藏div。但是发现如果没有取消事件冒泡，点击按钮始终不会显示div，那是因为事件一层一层往上冒泡，最终去到document，直接执行了document上的点击事件。实际上不是没有显示出div，而是显示瞬间又执行了document的点阅读全文

posted @ 2017-01-19 16:41 萤子阅读(402) 评论(0) 推荐(0)

事件捕获（IE下正常拖拽）

摘要：在IE浏览器下如果没有加上事件捕获语句就会发生在拖拽时选中文字的情况。阅读全文

posted @ 2017-01-19 16:30 萤子阅读(261) 评论(0) 推荐(0)

事件绑定，兼容IE9以下

摘要：无阅读全文

posted @ 2017-01-19 16:26 萤子阅读(834) 评论(0) 推荐(0)

鼠标拖拽和吸附功能

摘要：阅读全文

posted @ 2017-01-19 16:20 萤子阅读(956) 评论(0) 推荐(0)

div跟着鼠标移动

摘要：对event事件的运用和兼容性处理，以及出现滚动条的情况，event.clientX和event.clientY分别代表鼠标的横纵坐标。阅读全文

posted @ 2017-01-19 16:15 萤子阅读(101) 评论(0) 推荐(0)

CSS响应式

摘要：通过媒体查询当浏览器宽小于600px时执行。阅读全文

posted @ 2017-01-18 17:18 萤子阅读(122) 评论(0) 推荐(0)

CSS3旋转动画，兼容各浏览器

摘要：CSS3旋转动画 3D旋转阅读全文

posted @ 2017-01-18 16:57 萤子阅读(7608) 评论(0) 推荐(0)

任意值运动函数，可适用于任何运动。

摘要：任意值运动函数阅读全文

posted @ 2017-01-18 16:52 萤子阅读(259) 评论(0) 推荐(0)

JS页面悬浮广告

摘要：这个其实可以通过position:fixed;来直接固定元素的位置，这里是用JS缓冲运动来写的悬浮框，显示到右侧与浏览器保持居中位置。阅读全文

posted @ 2017-01-18 16:45 萤子阅读(1944) 评论(0) 推荐(0)

JS淡入淡出

摘要：跟其他物体运动略有不同，物体透明度在IE9以下版本有不兼容的情况，因此要用filter:alpha(opacity:30);这样的写法兼容，我们需要声明一个变量alpha = 30;来保存一下当前的透明度，再通过改变变量的值来修改透明度。当然用JQ的fadeIn和fadeOut也可以实现同样的效果，阅读全文

posted @ 2017-01-18 16:35 萤子阅读(266) 评论(0) 推荐(0)

JS缓冲运动

摘要：跟匀速运动不同的是，缓冲运动的运动方式是先快后慢，所以必须想办法让速度越来越慢。这里用iTarget作为参数代表目标点，可以通过(iTarget-oDiv.offsetLeft)/15（分母自取，可控制速度快慢）这样的算法让速度越来越慢，到最后除出来的是小数，所以必须要向上和向下取整以至精准。阅读全文

posted @ 2017-01-18 16:24 萤子阅读(164) 评论(0) 推荐(0)

JS匀速运动

摘要：JS控制物体运动，关键的一步是要运动的物体样式中要设定绝对定位position: absolute，这里主要是通过定时器控制物体匀速运动，每隔30毫秒让物体运动10个像素，直到符合判断条件移动到300px的位置关闭定时器，这用CSS3动画完全能达到同样的效果。一般定时器的开和关都是成对出现的，为了避阅读全文

posted @ 2017-01-05 14:09 萤子阅读(161) 评论(0) 推荐(0)

萤子

01 2017 档案

公告