這課程有源代碼的下載么？
有源代碼的下載么？
流浪的bug
2015-04-02
3 回答
舉報(bào)
0/150
提交
取消
有源代碼的下載么？
2015-04-02
舉報(bào)
2016-04-20
本節(jié)用到的代碼，純手工打造。。
<!DOCTYPE html>
<html>
<head>
? ? <meta charset="UTF-8">
? ? <title>Duang duang 氣泡</title>
? ? <link rel="stylesheet" href="css/duang.css"/>
? ??
? ? <style>
? ? html, body {
? ? ? ? margin:0;
? ? ? ? padding:0;
? ? ? ? width:100%;
? ? ? ? height:100%;
? ? ? ? background:#001122;
? ? ? ? line-height:0;
? ? ? ? font-size:0;
? ? }
</style>
</head>
<body>
? ? <svg width="100%"height="100%"?
? ? ? ? ?viewBox="-400 -300 800 600"
? ? ? ? ?preserveAspectRatio="xMidYMid slice">
? ? ? ? <defs>
? ? ? ? ? ? <polygon id="star" points="0 -10 2 -2 10 0 2 2 0 10 -2 2 -10 0 -2 -2" fill="white"></polygon>
? ? ? ? </defs>
? ? ? ? ?<g id="star-group">
? ? ? ? </g>
? ? ??
? ? </svg>
? ? <script>
? ? ? ? var SVG_NS = 'http://www.w3.org/2000/svg';
? ? ? ? var XLINK_NS = 'http://www.w3.org/1999/xlink';
? ? ? ? var paper = document.querySelector('svg');
? ? ? ? renderStar();
? ? ? ? function use(origin) {
? ? ? ? ? ? var _use = document.createElementNS(SVG_NS, 'use');
? ? ? ? ? ? _use.setAttributeNS(XLINK_NS, 'xlink:href', '#' + origin.id);
? ? ? ? ? ? return _use;
? ? ? ? }
? ? ? ? function random(min, max) {
? ? ? ? ? ? return min + (max - min) * Math.random();
? ? ? ? }
? ? ? ? function renderStar() {
? ? ? ? ? ? var starRef = document.getElementById('star');
? ? ? ? ? ? var starGroup = document.getElementById('star-group');
? ? ? ? ? ? var starCount = 500;
? ? ? ?
? ? ? ? ? ?var star;
? ? ? ? while (starCount--) {
? ? ? ? ? ? star = use(starRef);
? ? ? ? ? ? star.setAttribute('opacity', random(0.1, 0.4));
? ? ? ? ? ? star.setAttribute('transform',
? ? ? ? ? ? ? ? 'translate(' + random(-400, 400) + ',' + random(-300, 50) + ')'
? ? ? ? ? ? ? ? +
? ? ? ? ? ? ? ? 'scale('+random(0.1,0.6)+')' );
? ? ? ? ? ? starGroup.appendChild(star);
? ? ? ? }
? ? ? ? }
? ? </script>
</body>
</html>
2015-05-15
是所有的，不是一個(gè)一個(gè)的下載好麻煩
2015-04-02
視頻右下角位置有相關(guān)資料下載，注意看~~