html+css
我有一个小毛驴
爱音乐,爱编程。
展开
-
html+css+jquery实现折叠板(模仿搜索风云榜折叠板)
1、关键技术:html 实现布局;css 控制样式;jquery 实现功能;2、重点技术:jquery 鼠标触摸到当前的 显示当前节点下一个节点的内容,隐藏别的节点其余的下一个节点内容3、关键代码: $(function(){ $("#main h3").each(function(index){//循环遍历每一个h3节点 $(this).mousemove(functi原创 2013-12-27 20:28:03 · 3022 阅读 · 1 评论 -
js实现列表无间隙循环滚动
无间隙循环滚动 body { font-size: 12px; line-height: 24px; text-algin: center; /* 页面内容居中 */ } * { margin: 0px; padding: 0px; /* 去掉所有标签的marign和padding的值 */原创 2014-10-08 20:41:51 · 1356 阅读 · 0 评论 -
javascript实现列表有停顿循环滚动
无间隙循环滚动 body { font-size: 12px; line-height: 24px; text-algin: center; /* 页面内容居中 */ } * { margin: 0px; padding: 0px; /* 去掉所有标签的marign和padding的值 */原创 2014-10-08 20:45:43 · 1182 阅读 · 0 评论 -
js实现图片瀑布流布局
js实现瀑布流 body{ margin:0px; padding:0px; } *{ margin:0px; padding:0px; } #container{ width:900px; height:auto; margin:30px auto 0 auto; position:relative; } .原创 2014-10-08 20:39:14 · 1518 阅读 · 0 评论 -
Jquery实现checkbox全选和反选
直接看代码: 全选和复选 #main{margin:100px auto;} #mainTable > table{border:1px solid red;} #mainTable > table tr td{border:1px solid red;} $(function(){ $("#checkAll").click(fu原创 2014-09-14 20:34:32 · 1324 阅读 · 0 评论 -
FireBug调试工具
插件FireBug 简介:fire不过是一款基于前段开发的工具,是Firefox浏览器 的扩展插件,它可以调试javascript,查看DOM、分析 css、监控网络流量以及进行ajax的交互等。一:概述1、Firebug的特色: 查看和编辑html 动态修改css样式 可视化的css距离调整 监控网络原创 2014-09-13 19:44:21 · 935 阅读 · 0 评论 -
第十讲:html5中canvas实现正方体的动态旋转
在html5的画布上,画出三维图形,并且实现它动态的围着一个原创 2014-06-11 20:48:15 · 3946 阅读 · 0 评论 -
第八讲:HTML5中canvas实现小球击打小方块游戏
随着html5技术的不断成熟,用html5开发网页游戏也是一种趋势。本文将讲解使用html5中的canvas标签编写一个小球击小方块的休闲游戏,阐述了编写的流程以及编写的注意事项和代码的分析。主要从定义画布开始,随后说明小球、移动小方块和小方块的定义,然后添加各个模块的方法事件,最后判断其游戏的成功和失败。文中还包含部分源代码、源代码下载地址和相关逻辑的图解说明。原创 2014-06-09 13:45:42 · 3492 阅读 · 1 评论 -
第九讲:HTML5中的canvas实现推箱子雏形
方块的移动 body{margin:0px;padding:0px;} #main{margin: 100 auto 0 auto;border: 10px solid #030303;width:300px;height:460px;border-radius:10px;} var canvas = documen原创 2014-06-10 19:38:54 · 2544 阅读 · 0 评论 -
第六讲:html5中canvas实现疯狂的大炮轰击
大炮 var canvas = document.getElementById('mc'); var cxt = canvas.getContext('2d'); //设置画布背景颜色 cxt.fillStyle = "#030303"; cxt.fillRect(0, 0, canvas.width, canvas.heig原创 2014-06-07 16:57:45 · 1939 阅读 · 0 评论 -
第四讲:使用html5中的canvas标签画出一个球在指定区域内的运动
小球在一个区域运动 var canvas = document.getElementById('mc'); var cxt = canvas.getContext('2d'); //定义一个小球 var ball = { position : {x : 100,y : 100}, //球的位置 r : 30, //球的半径原创 2014-06-06 21:48:03 · 3190 阅读 · 0 评论 -
第五讲:使用html5中的canvas动态画出物理学上平抛运动
平抛运动 var canvas = document.getElementById('mc'); var cxt = canvas.getContext('2d'); //定义一个小球 var balls = []; balls.length = 0; //先定义两个球 var ball_1 = {//平抛运动的球原创 2014-06-07 15:47:10 · 2382 阅读 · 2 评论 -
第七讲:HTML5中的canvas两个小球完全弹性碰撞
小球之间的碰撞(完全弹性碰撞)var canvas = document.getElementById('mc');var cxt = canvas.getContext('2d');//设置画布背景颜色cxt.fillStyle = "#030303"; cxt.fillRect(0, 0, canvas.width, canvas.heig原创 2014-06-08 14:32:07 · 5452 阅读 · 0 评论 -
第二讲:使用HTML5绘制简单的图形
初识canvas var canvas = document.getElementById('mc'); var ctx = canvas.getContext('2d'); //画出指定的图像 var somethingAsync = eval(Jscex.compile("async",function(){ //绘制坐标线原创 2014-06-06 16:40:23 · 1024 阅读 · 0 评论 -
第三讲:动态画圆
初识canvas var canvas = document.getElementById('mc'); var ctx = canvas.getContext('2d'); var x = 150; var y = 150; var r = 100; //画出指定的图像 var somethingAsync = ev原创 2014-06-06 16:57:31 · 1100 阅读 · 0 评论 -
第一讲:使用html5——canvas绘制奥运五环
初识canvas var canvas = document.getElementById('mc'); var ctx = canvas.getContext('2d'); ctx.lineWidth = 5;//设置yuan ctx.strokeStyle = "#163B62"; ctx.beginPath(); ctx原创 2014-06-06 11:52:47 · 4407 阅读 · 0 评论 -
无间隙循环滚动
无间隙循环滚动 body { font-size: 12px; line-height: 24px; text-algin: center; /* 页面内容居中 */ } * { margin: 0px; padding: 0px; /* 去掉所有标签的marign和padding的值 */原创 2014-12-03 20:48:57 · 998 阅读 · 0 评论