陌上花会开
- 浏览: 38053 次
- 性别:
- 来自: 苏州
-
最新评论
-
yzs1013：
偷别人的样式更快，这类型工具很多人想找。现在有个工具操作起来比 ...
CSS3实战开发:使用CSS过滤效果来改变图片样式 -
mingnianshimanian：
现在谁还用自己写，样式也不好看，现成的插件有很多
Javascript实战开发：教你使用raphael.js绘制中国地图 -
小橙子：
mark!
CSS3实战开发: 手把手教大家实战开发鼠标划过图片动画特效 -
aatend：
mark!
CSS3实战开发: 手把手教大家实战开发鼠标划过图片动画特效 -
wx_hello：
CSS3是不是兼容这些主流浏览器？
CSS3实战开发:手把手教你照片墙实战开发
文章列表
Media Queries 就是要在支援CSS3 的浏览器中才能正常工作，IE8 以下不支持。 而Media Queries 的套用方法千变万化，要套用在什么样的装置中，都可以自己来定义。
到底什么是Media Queries ？ 一般我们在开发HTML + CSS 网页中，都会 ...
今天我给大家介绍一款圆形统计图circliful，它基于HTML5的画布和jQuery，无需使用图像轻松实现圆形统计图，而且有很多属性设置，使用起来非常方便。
首先我们需要将jquery库文件和jquery.circliful.min.js引入到页面中
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="js/jquery.circliful.min.js"></script>
...
使用过百度统计或者cnzz统计的童鞋应该知道，后台有一个地图统计，不同访问量的省份显示的颜色也不一样，今天我将带领大家开发一个这样的案例。上一篇《使用raphael.js绘制中国地图》文章中，我给大家介绍了如何使用raphael ...
最近的数据统计项目中要用到中国地图，也就是在地图上动态的显示某个时间段某个省份地区的统计数据，我们不需要flash，仅仅依靠raphael.js以及SVG图像就可以完成地图的交互操作。在本文中，我给大家分享如何使用js来完成地图交互。
先简单介绍下raphael.js，raphael.js是一个很小的javascript库，它可以在网页中实现绘制各种矢量图、各类图表、以及图像裁剪、旋转、运动动画等等功能。此外raphael.js还跨浏览器兼容，而且还兼容老掉牙的IE6啊。raphael.js的官网地址： http://raphaeljs.com/
准备工作
我们需要准备一张矢量地图， ...
在计算机科学中，正则表达式用来描述或者匹配一系列符合某个句法规则的字符串的单个字符串。在WEB开发中，正则表达式通常用来检测、查找替换某些符合规则的字符串，如检测用户输入E-mai格式是否正确，采集符合规则的页面内容等等。今天我将分别用PHP和Javascript向大家介绍WEB开发中最常用最实用的正则表达式及其用法，正则表达式是一门学科，不可能使用一篇文章来讲解完，理论的东西网上很多，有兴趣的同学可以搜一大把。不过你也许没必要去埋头学习琢磨不透的正则表达式，看本文和实例给您呈现常用、实用的正则表达式。
PHP常用表达式用法
1.匹配正整数：/^[1-9]\d*$/
2.匹配非负整数 ...
俗话说的好：武功再好，一砖撂倒；功夫再高,也怕菜刀。可想而知，拥有工具是多么重要！！！哈哈，不闲扯了，直接给大家上工具吧。很多大牛都是有一套自己钟爱的工具集和资源集的哦。在今天这篇文章中，我将介绍一些能够帮助你高效开发的工具脚本和资源，权当抛砖引玉，希望能够带给大家帮助。
1. JSFIDDLEJSFIDDLE是一个超棒的在线JS/CSS/HTML调试和分享工具，大家可以方便的在web页面中分享代码，或者调试代码。并且有效的和同事或者朋友分享。
2. JSBinJSbin是另外一个相当不错的在线调试和分享网站，和JSFIDDLE非常类似，但是整体界面更偏重于编辑和调试。你拥有更大的 ...
各位网友大家好，今天我要带领大家开发一个纯CSS的图片分类显示的网址导航，单纯看标题大家可能有些困惑，依照以往惯例，我先给大家演示一下实际运行效果：
从上面的运行效果，大家不难发现，当我点击某一菜单时， ...
各位网友，大家好，我是陌上花会开。
我们知道，使用Photoshop来调整图像的亮度和对比度，或者将图片转化为灰度等等是很常见的功能。今天我将给大家介绍几个新特性，我们使用CSS来给web图像添加相同的效果。
首先我们先在网页中显示一张图片,html代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="styles.css" media=" ...
各位网友，大家好，我是实战互联网技术部的陌上花会开。前一段时间我给大家分享了一系列CSS3实战开发的案例，继续以前的脚步。
在本次CSS3实战开发案例中，我将手把手带领大家开发纯CSS3的手风琴特效开发。一如既往，先给大家演示效果动画：
上面的效果是纯CSS开发的，大家是不是觉得很棒呢。
现在我将分步骤带领大家实战开发今天的特效。首先，编写html源代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="s ...
各位网友，今天这篇文章，我将手把手带领大家开发百度新闻首页的"新闻热搜词"特效。在这个特效中应用的知识点都很基础，如果你对这些还不清楚，可以关注我以前写的详细教程。今天讲这个案例，也是希望告诉大家，在开发一个特效的时候，请不要将问题复杂化。可能有些人一开始真的不知道从哪下手，当你看完本次教程，你定会觉得，原来一切都这么简单。
可能有些人还不知道这个特效，啥也不说了，直接上效果图：
从上面的特效中，大家不难发现，当鼠标划过热搜词时，会有一个半透明的黑色背景滑上来，而且这个黑色区域中也是有热搜词的。
大概知道这些细节后，现在我就分步骤带领大家开发这个特效。
根据上 ...
各位网友，如果你已经看过我的CSS3实战开发系列教程，我相信你对CSS3已经有了非常全面深刻的了解。有些人可能CSS3语法掌握了不少，但是真正实际用起来还有点生疏，甚至无从下手。请别担心，我会不断更新一系列实战开发案例，我会为大家分步骤剖析特效开发过程。
今天我将手把手带领大家开发一个鼠标滑动的特效案例，废话不多说，直接上效果动画：
你有没有觉得上面的这个特效很棒呢!
好，现在咱们就开始分步骤实战开发这个动画特效吧：
首先，我们先准备好html页面代码：
<!DOCTYPE html>
<html>
<head>
...
各位网友，大家好，我是陌上花会开，今天这个案例，我将带领大家,手把手教大家开发一个会发光的表单组，还是先秀运行效果图吧：
从这个效果图，大家可以发现，当光标在某个组件上时，它就会发光，今天我将带领大家 ...
CSS的选择器，我想大家并不会陌生吧，因为天天在使用，但对于CSS3的选择器，要运用的灵活到位，我想对很多朋友还是一定的难度，特别是CSS3中的:nth选择器。那么从现在开始我们先丢开他们版本的区别，从头一起来看看CSS选择 ...
上一章在《CSS3基本选择器》中主要介绍了CSS3选择器的第一部分，这节主要和大家一起来学习CSS3选择器的第二部分——属性选择器。属性选择器早在CSS2中就被引入了，其主要作用就是对带有指定属性的HTML 元素设置样式。使用CSS3属性选择器，你可以只指定元素的某个属性，或者你还可以同时指定元素的某个属性和其对应的属性值。
从上一节展示的CSS3选择器的图表中，我们可以知道，CSS3的属性选择器主要包括以下几种：
E[attr]：只使用属性名，但没有确定任何属性值；
E[attr="value"]：指定属性名，并指定了该属性的属性值；
E[attr~=&q ...
前面花了两节内容分别在《CSS3基本选择器》和《CSS3属性选择器详解》介绍了CSS3选择器中的基本选择器和属性选择器使用方法，今天要和大家一起学习CSS3选择器中的第三部分，也是最后一部分——伪类选择器。伪类选择器对于大家来说最熟悉的莫过于:link,:focus,:hover之类的了，因为这些在平时中是常用到的伪类选择器，那么先和大家一起简单总结一下CSS中常用的伪类选择器的使用方法，最后把重心放到CSS3新增加的":nth-child"选择器的使用方法。
和前面一样，在开始之前先创建一个Dom:
<div class="demo clearfix& ...