来源:flash,as,js兴趣爱好者HTML5+JS瀑布及海浪一些特效 <!doctype html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Canvas Cycle: True 8-bit Color Cycling with HTML5</title>
<meta name="generator" content="TextMate http://macromates.com/">
<meta name="author" content="Joseph Huckaby">
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<link rel="stylesheet" type="text/css" href="style.css" >
<script type="text/javascript" src="oop.js"></script>
<script type="text/javascript" src="tools.js"></script>
<script type="text/javascript" src="cookie.js"></script>
<script type="text/javascript" src="palette.js"></script>
<script type="text/javascript" src="bitmap.js"></script>
<script type="text/javascript" src="scenes.js"></script>
<script type="text/javascript" src="tween.js"></script>
<script type="text/javascript" src="framecount.js"></script>
<script type="text/javascript" src="main.js"></script>
</head>
<body>
<div id='aaa'></div>
<div id="container">
<div id="d_header">
<div id="d_scene_selector"></div>
<div id="d_scene_btns">
<div class="button left" onClick="CC.jumpScene(-1)">< Prev</div><div class="button right" onClick="CC.jumpScene(1)">Next ></div>
</div>
<div id="d_options_control">
<div id="btn_options_toggle" class="button left right" onClick="CC.toggleOptions()">Show Options »</div>
</div>
<div class="clear"></div>
</div>
<div id="d_loading"></div>
<canvas id="mycanvas" width="640" height="480" style=""></canvas>
<div id="d_options">
<div class="label">SOUND:</div>
<div class="section">
<div id="btn_sound_off" class="button left" onClick="CC.setSound(false)">Off</div><div id="btn_sound_on" class="button right selected" onClick="CC.setSound(true)">On</div>
</div>
<div class="label">ZOOM:</div>
<div class="section">
<div id="btn_zoom_actual" class="button left selected" onClick="CC.setZoom(false)">Actual</div><div id="btn_zoom_max" class="button right" onClick="CC.setZoom(true)">Max</div>
</div>
<div class="label">CYCLE SPEED:</div>
<div class="section">
<div id="btn_speed_025" class="button thin left" onClick="CC.setSpeed(0.25)">¼</div><div id="btn_speed_05" class="button thin" onClick="CC.setSpeed(0.5)">½</div><div id="btn_speed_1" class="button thin selected" onClick="CC.setSpeed(1)">1</div><div id="btn_speed_2" class="button thin" onClick="CC.setSpeed(2)">2</div><div id="btn_speed_4" class="button thin right" onClick="CC.setSpeed(4)">4</div>
</div>
<div class="label">CYCLE MODE:</div>
<div class="section">
<div id="btn_blendshift_off" class="button left" onClick="CC.setBlendShift(false)">Standard</div><div id="btn_blendshift_on" class="button right selected" onClick="CC.setBlendShift(true)">Blend</div>
</div>
<div class="label">PALETTE:</div>
<div id="palette_display"></div>
<div id="d_debug"></div>
</div>
<div class="clear"></div>
</div>
<div id="d_footer">
<span><a href="http://www.effectgames.com/effect/article.psp.html/joe/Old_School_Color_Cycling_with_HTML5" target="_blank">Canvas Cycle: True 8-bit Color Cycling with HTML5</a></span>
<span>Art by <a href="http://www.markferrari.com" target="_blank">Mark Ferrari</a></span>
<span>Code by Joseph Huckaby</span>
</div>
<script language="JavaScript">
if (document.addEventListener) {
document.addEventListener( "DOMContentLoaded", function() {
document.removeEventListener( "DOMContentLoaded", arguments.callee, false );
CC.init();
}, false );
window.addEventListener( "load", function() {
window.removeEventListener( "load", arguments.callee, false );
CC.init();
}, false );
window.addEventListener( "resize", function() {
CC.handleResize();
}, false );
}
else if (window.attachEvent) {
}
</script>
image.php?file=VDBAM&callback=CanvasCycle.processImage
<script type="text/javascript"> var _gaq = _gaq || [];_gaq.push(['_setAccount', 'UA-5875241-1']);_gaq.push(['_trackPageview']); (function() {var ga = document.createElement('script');ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';ga.setAttribute('async', 'true');document.documentElement.firstChild.appendChild(ga);})(); </script>
</body>
</html>
HTML5+JS瀑布及海浪一些特效
liujieheng
2013-12-06
|
|
argel_lj
2014-01-04
|
|
u013680195
2014-04-02
CSS基础教程17篇
此教程共17篇,由浅到深、循序渐进的讲述CSS知识。 对初学者有很大的学习价值,对已入门的朋友也有重要的参考价值。 1、CSS的应用 http://www.weby.com.cn/view.asp?id=13 2、CSS Selectors,Properties,and Values 选择器 、属性、值 http://www.weby.com.cn/view.asp?id=14 3、CSS的color颜色 http://www.weby.com.cn/view.asp?id=15 4、CSS的Text 文本 http://www.weby.com.cn/view.asp?id=16 5、Margin和Padding http://www.weby.com.cn/view.asp?id=17 补充:CSS盒模型(Box Model)问题详解 http://www.weby.com.cn/view.asp?id=18 6、CSS的Border边框 http://www.weby.com.cn/view.asp?id=19 7、CSS属性结合起来使用 http://www.weby.com.cn/view.asp?id=20 8、CSS的Class以及ID选择器 http://www.weby.com.cn/view.asp?id=21 9、CSS的Grouping and Nesting分组和嵌套 http://www.weby.com.cn/view.asp?id=22 10、CSS的Pseudo Classes 伪类 http://www.weby.com.cn/view.asp?id=23 11、CSS的属性缩写 http://www.weby.com.cn/view.asp?id=24 12、CSS的Background Images 背景图片 http://www.weby.com.cn/view.asp?id=25 13、CSS的display属性 http://www.weby.com.cn/view.asp?id=26 14、CSS网页布局Page Layout http://www.weby.com.cn/view.asp?id=27 15、CSS的At-Rules@规则 http://www.weby.com.cn/view.asp?id=28 16、CSS的伪元素Pseudo Elements http://www.weby.com.cn/view.asp?id=29 17、CSS的优先级特性Specificity http://www.weby.com.cn/view.asp?id=30 |