唐一峰-CSDN博客

原创 HTML5 canvas绘制雪花飘落动画（需求分析、知识点、程序编写分布详解）

看到网上很多展示html5雪花飞动的效果，确实非常引人入胜，我相信大家也跟我一样看着心动的同时，也很好奇，想研究下代码如何实现；虽然哦很多地方也能下载这些源码，不过也不知道别人制作此类动画时的思路及难点分析。我这几天刚好学习了一下，也趁着此刻有时间从需求分析、知识点、程序编写一步步给大家解剖下，要是在各位关公面前耍大刀了，可别见笑哟。最终效果图如下：图1一、需求分析：

2016-03-08 00:28:32 2236 5

原创 CSS3 skew倾斜、rotate旋转动画

css3出现之前，我们实现一个对象的一组连续动画需要通过JavaScript或Jquery编写，脚本代码较为复杂；若需要实现倾斜、旋转之类的动画难度将更高（我还没试过用JavaScript或Jquery如何实现），而且即使能实现估计花的时间代价及维护难度是很大的，很多时候只能依靠画图工具制作此类动画文件；有时候在想如果不用脚本语言，也不用画图工作制作动画文件，就能在网页上实现倾斜、

2016-03-06 17:28:06 2120 6

原创 CSS3鼠标移入移出图片生成随机动画

今天分享使用html+css3+少量jquery实现鼠标移入移出图片生成随机动画，我们先看最终效果图（截图为静态效果，做出来可是动态的哟）左右旋转上下移动缩放由于时间关系我就不一步步解析各段代码所代表含义，我这里就给出一些思路及关键代码：1、首先使用ul li展现4张图片本示例中不仅使用了图片，在图片表面还放置了一段“WEB”字样文字

2016-03-05 23:36:45 1452

原创 SVG绘制圆形简单示例分享

今天分享“svg绘制圆形”部分1、简单圆形效果图如下：关键代码：svg xmlns="http://www.w3.org/2000/svg" version="1.1"> circle cx="40" cy="40" r="40">circle>svg>代码解析：cx和cy属性定义圆点的x和y坐标。如果省略cx和c

2016-02-23 21:55:21 2097

原创 SVG绘制矩形简单示例分享

最近我初学HTML5，刚在一步步学习SVG，积累了一些个人心得和程序代码，希望和大家分享，今天分享“svg之矩形”部分1、简单矩形效果图如下：关键代码：代码解析：rect 元素代表矩形；width 和 height 属性可定义矩形的高度和宽度；2、矩形填充颜色及边框效果图如下：关键代码：

2016-02-22 20:53:38 2270

原创 CSS三角形广告文字

街上经常碰到一些发各类广告传单的，有一次收到一张房地产广告的传单，顺手留下来，看着里面有些广告挺吸引人，同时也想练练自己css技术，故抽空做了一下。原图某区域如下：实现上图效果是需要一些想象力的，比如三角形的构成和左右两边的空白间距，懂的这个原理，然后熟练运用border属性，一切就OK了比如其中一个三角形 div.arrow_ltitle1 {

2015-12-25 13:44:08 660

原创 CSS鼠标点击式变化图片透明度

今天分享前端代码主题：jequery控制css图片透明度很多时候在网站图片处理上需要实现一些辅助效果，比如鼠标在图片上滑动时或点击时改变图片颜色（变灰或者其他），其实一个简单的办法就是改变图片css透明度属性。如何改变呢？一种是纯css，一种使用jquery或者javascript代码控制。第一种使用:hover伪类选择器，本示例使用第二种。先看最后效果：第一步

2015-11-28 08:08:32 1508

原创 C#连接、访问MySQL数据库

一、准备工具visual stuido（本示例使用visual studio 2010）MySql.Data.dllmysql_installer_community_V5.6.21.1_setup.1415604646.msi（网上搜索去下载或者向我索要，联系方式在http://xunwn.com/1010100）二、新建DBUtility通用访问MySQL类库

2015-11-17 14:39:56 3828

转载 CSS一级导航-天蓝色（带阴影）

一款亮丽的导航，能给网站一个画龙点睛的作用。导航在指引用户搜寻内容时，还能改变用户浏览网站的心情，浏览网站也像一场旅行，有创意的导航栏让用户欣赏起来也会更加愉悦，增加对网站的兴趣。本人不擅长美工制作，不过可以从某些漂亮的网站中提取不错的部分为自己所用，也为他人分享。今天这里为大家准备了一款天蓝色导航一起学习。我们先看最终效果：第一步：放置一个div作为导航主体部分

2015-11-10 14:51:38 20255

唐一峰