js背景特效(网站js背景特效)
本篇文章给大家谈谈js背景特效，以及网站js背景特效对应的知识点，文章可能有点长，但是希望大家可以阅读完，增长自己的知识，最重要的是希望对各位有所帮助，可以解决了您的问题，不要忘了收藏本站喔。
怎么给html5背景加上js粒子特效
使用了particles.js
particles.js可以从github网站下载到最新的源码，网址是
使用方法非常简单
第一步，在html中引入脚本文件 particles.min.js，这个文件在下载的压缩包里可以找到
<scriptsrc="particles.min.js"></script>第二步，在html中放入一个div容器，设置id为particles-js。这个一般放在所有网页元素的最后面就可以。
<divid="particles-js"></div>
<styletype="text/css">
#particles-js{
position:absolute;
top:0;
width:100%;
}
</style>第三步，设置窗口样式
<styletype="text/css">
#particles-js{
z-index:-1;
position:absolute;
top:0;
width:100%;
background:#aaa;
}</style>第四步，脚本生成粒子效果，可以单独放在一个js文件里，也可以放在<script>标签里。无论如何，这段脚本要出现在div容器之后。
particlesJS("particles-js",{"particles":{"number":{"value":380,"density":{"enable":true,"value_area":800
}
},"color":{"value":"#ffffff"
},"shape":{"type":"circle","stroke":{"width":0,"color":"#000000"
},"polygon":{"nb_sides":5
},"image":{"src":"img/github.svg","width":100,"height":100
}
},"opacity":{"value":0.5,"random":false,"anim":{"enable":false,"speed":1,"opacity_min":0.1,"sync":false
}
},"size":{"value":3,"random":true,"anim":{"enable":false,"speed":40,"size_min":0.1,"sync":false
}
},"line_linked":{"enable":true,"distance":150,"color":"#ffffff","opacity":0.4,"width":1
},"move":{"enable":true,"speed":6,"direction":"none","random":false,"straight":false,"out_mode":"out","bounce":false,"attract":{"enable":false,"rotateX":600,"rotateY":1200
}
}
},"interactivity":{"detect_on":"canvas","events":{"onhover":{"enable":true,"mode":"grab"
},"onclick":{"enable":true,"mode":"push"
},"resize":true
},"modes":{"grab":{"distance":140,"line_linked":{"opacity":1
}
},"bubble":{"distance":400,"size":40,"duration":2,"opacity":8,"speed":3
},"repulse":{"distance":200,"duration":0.4
},"push":{"particles_nb":4
},"remove":{"particles_nb":2
}
}
},"retina_detect":true});
js有哪些常用的效果
这个确实比较多，常用的特效就是淡入淡出啊、渐变啊、滑动、展开伸缩、移动、拖动、最常用。其实你看下jQuery ui的官网基本就了解了所有常用的特效了
按类型可以分为下面几大类的特效集合：
Ui类的：
背景
对话框
筛选及排序
反馈
弹出层
悬停
布局
图表
加载
圆边
滚动
标签
文本链接
工具提示
网络类型
输入类型的：
拾色器
定制和风格
日期和时间
拖和放
通用输入
自动完成
密码
投票率
搜索
选择框
快捷键
触摸
丰富的输入
上传
验证
媒体类型：
音频和视频
幻灯片和轮播图
图片展示
图像
地图
滑块和旋转
Tabs
导航：
水平导航
垂直导航
文件树
分页
手风琴菜单
其他
网页特效代码
1.这个特效的代码我复制在文本改后缀打开,效果大打折扣,为什么?
你再仔细的看下代码这段
ILTER: progid:dximagetransform.microsoft.gradientwipe(duration=1); BEHAVIOR: url(images/xs.htc)
这段是CSS，其中BEHAVIOR: url(images/xs.htc)表示网页背景文件，如果你单纯的复制代码没有对应的背景文件，效果当然大打折扣了
2.还有每次打开自做的网也上面都有个安全提示,很麻烦,怎么关?
因为这段代码用了JS，本机测试机器会有提示
这是IE高版本增加的安全限制，你可以在工具-internet选项-安全-自定义里来更改脚本安全级别，但不建议你这样，这样改了很容易中网页木马
END，本文到此结束，如果可以帮助到大家，还望关注本站哦！