大家好，感谢邀请，今天来为大家分享一下js特效网站源码的问题，以及和源码分享的一些困惑，大家要是还不太明白的话，也没有关系，因为接下来将为大家分享，希望可以帮助到大家，解决大家的问题，下面就开始吧！
一、怎么给html5背景加上js粒子特效
particles.js可以从github网站下载到最新的源码，网址是 https://github.com/VincentGarreau/particles.js/
第一步，在html中引入脚本文件 particles.min.js，这个文件在下载的压缩包里可以找到
<scriptsrc="particles.min.js"></script>
第二步，在html中放入一个div容器，设置id为particles-js。这个一般放在所有网页元素的最后面就可以。
第二步，在html中放入一个div容器，设置id为particles-js。这个一般放在所有网页元素的最后面就可以。
<divid="particles-js"></div>
</style>
第三步，设置窗口样式
}</style>
第四步，脚本生成粒子效果，可以单独放在一个js文件里，也可以放在<script>标签里。无论如何，这段脚本要出现在div容器之后。
第四步，脚本生成粒子效果，可以单独放在一个js文件里，也可以放在<script>标签里。无论如何，这段脚本要出现在div容器之后。
particlesJS("particles-js",{"particles":{"number":{"value":380,"density":{"enable":true,"value_area":800
},"shape":{"type":"circle","stroke":{"width":0,"color":"#000000"
},"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"
},"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
},"retina_detect":true});
二、关于Javascript 特效代码
1、<script language="JavaScript">
2、<!-- Hide the script from old browsers--
3、function compute(obj)//定义一个函数名字叫compute他接收了一个参数 obj
4、{obj.expr.value= eval(obj.expr.value)}//当前的参数的值和下文参数值所用的方法相同
5、var one='1'//定义一个字符型的1
6、var two='2'//定义一个字符型的2
7、var three='3'//定义一个字符型的3
8、var four='4'//定义一个字符型的4
9、var five='5'//定义一个字符型的5
10、var six='6'//定义一个字符型的6
11、var seven='7'//定义一个字符型的7
12、var eight='8'//定义一个字符型的8
13、var nine='9'//定义一个字符型的9
14、var zero='0'//定义一个字符型的0
15、var plus='+'//定义一个字符型的+
16、var minus='-'//定义一个字符型的*
17、var multiply='*'//定义一个字符型的*
18、var divide='/'//定义一个字符型的/
19、var decimal='.'//定义一个字符型的.
20、function enter(obj, string)//定义一个函数名字叫enter他接收了一个参数 obj
21、{obj.expr.value+= string}//让 obj的值加上'+'后面的值
22、function clear(obj)//定义一个函数名字叫clear他接收了一个参数 obj
23、{obj.expr.value=''}//让obj的值等于空
24、<td colspan=4><input type="text" name="expr" size=30 action="compute(this.form)"><tr>
25、<td><input type="button" value=" 7" onClick="enter(this.form, seven)"><!--当鼠标点击
26、按钮的时候提交给函数按钮中的值-->
27、<td><input type="button" value=" 8" onClick="enter(this.form, eight)"><!--当鼠标点击
28、按钮的时候提交给函数按钮中的值-->
29、<td><input type="button" value=" 9" onClick="enter(this.form, nine)"><!--当鼠标点击
30、按钮的时候提交给函数按钮中的值-->
31、<td><input type="button" value="/" onClick="enter(this.form, divide)"><!--当鼠标点
32、击按钮的时候提交给函数按钮中的值-->
33、<tr><td><input type="button" value=" 4" onClick="enter(this.form, four)"><!--当鼠标
34、点击按钮的时候提交给函数按钮中的值-->
35、<td><input type="button" value=" 5" onClick="enter(this.form, five)"><!--当鼠标点击
36、按钮的时候提交给函数按钮中的值-->
37、<td><input type="button" value=" 6" onClick="enter(this.form, six)"><!--当鼠标点击按
38、钮的时候提交给函数按钮中的值-->
39、<td><input type="button" value="*" onClick="enter(this.form, multiply)"><!--当鼠标
40、点击按钮的时候提交给函数按钮中的值-->
41、<tr><td><input type="button" value=" 1" onClick="enter(this.form, one)"><!--当鼠标点
42、击按钮的时候提交给函数按钮中的值-->
43、<td><input type="button" value=" 2" onClick="enter(this.form, two)"><!--当鼠标点击按
44、钮的时候提交给函数按钮中的值-->
45、<td><input type="button" value=" 3" onClick="enter(this.form, three)"><!--当鼠标点击
46、按钮的时候提交给函数按钮中的值-->
47、<td><input type="button" value="-" onClick="enter(this.form, minus)"><!--当鼠标点
48、击按钮的时候提交给函数按钮中的值-->
49、<tr><td colspan=2><input type="button" value=" 0" onClick="enter
50、(this.form, zero)"><!--当鼠标点击按钮的时候提交给函数按钮中的值-->
51、<td><input type="button" value="." onClick="enter(this.form, decimal)"><!--当鼠标
52、点击按钮的时候提交给函数按钮中的值-->
53、<td><input type="button" value="+" onClick="enter(this.form, plus)"><!--当鼠标点击
54、按钮的时候提交给函数按钮中的值-->
55、<tr><td colspan=2><input type="button" value="=" onClick="compute(this.form)"><!
56、--提交表单在javascript中进行运算-->
57、<td colspan=2><input type="button" value="AC" size= 3 onClick="clear(this.form)"><!--
三、网站源码中出现js代码对seo的影响
1、坦白而言我认为JS对SEO的负面影响并非很大，只要网站中不含有太多的JS，因为现在搜索引擎确实不能够识别这样的一种编程语言。这一点Google和其他搜索引擎也作出过强调：尽量使用搜索引擎可以识别的文本信息，避免过多的JS、Cookies等复杂技术。是的，掌握一个度，可以更大的发挥JS对于SEO有利的一面。
2、如果既想使用JS代码，又想不干扰搜索引擎的抓取识别，该怎么办呢?其实这个问题也不是很难，重要的是：把握一个度!
3、方法一：千万不要再导航使用JS代码
4、把不重要的JS通通放到页面的最下面body的上面，实现异步加载，也就是等网页都加载完了，最后在加载这些不重要的JS，这样就不影响网页速度了。导航和网页中的其他链接是搜索引擎抓取的重点，当导航使用了JS代码，也就是说搜索引擎是无法识别的，那就不会抓取你的网页，更不用说什么排名了。
5、合并JS，也就是减少HTTP请求，少给服务器请求一次就加快一点速度，而合并两个原本独立的JS就需要点技术了
6、咱不讨论什么三目运算符、减少对象查找、如何让JS简洁，咱就用“JS减肥工具”。通常这类工具会把JS文件中几百行的代码压缩成一行，使体积变小。推荐工具：http://javascriptcompressor.com/。因为空行等问题，有时候使用这类工具会使JS功能失效，而最简单的办法是用Dreamweaver，把压缩后的JS放入DW中，DW会自动提示你那里有误，把错误的地方另起一行，或还原回去即可。
好了，文章到这里就结束啦，如果本次分享的js特效网站源码和源码分享问题对您有所帮助，还望关注下本站哦！
