使用raphael.js绘制中国地图

最近的数据统计项目中要用到中国地图,也就是在地图上动态的显示某个时间段某个省份地区的统计数据,我们不需要flash,仅仅依靠raphael.js以及SVG图像就可以完成地图的交互操作。在本文中,我给大家分享如何使用js来完成地图交互。 查看演示 下载源码 先简单介绍下raphael.js,raphael.js是一个...

       时间 : 2014-09-27| 栏目 : js知识| 浏览 : 280 次| [阅读全文]

    jQuery实现页内查找相关内容

    当需要在页面中查找某个关键字时,一是可以通过浏览器的查找功能实现,二是可以通过前端脚本准确查找定位,本文介绍通过jQuery实现的页面内容查找定位的功能,并可扩展显示查找后的相关信息。 查看演示 下载源码 本文以查找车站名为例,仿12306官网查找车站售票时间页面效果,当用户输入关键字点击查找按钮或按回车键时,jQuery通过...

         时间 : 2014-09-27| 栏目 : js知识| 浏览 : 278 次| [阅读全文]

      jQuery实现的全选、反选和不选功能

      本文给大家分享一段基于jQuery的全选、反选和不选功能的代码,适用于网页多选后需要进行批量操作的场景(如批量删除等)。文章结合实例,代码简洁,基本覆盖选项选择操作的方方面面,希望可以帮到有需要的WEB爱好者。 查看演示 HTML 我们的页面上有一个歌曲列表,列出多行歌曲名称,并匹配复选框供用户选择,并且在列表下方有一排操作按钮...

           时间 : 2014-09-27| 栏目 : js知识| 浏览 : 303 次| [阅读全文]

        Flexslider图片轮播、文字图片相结合滑动切换效果

        Flexslider是一款基于的jQuery内容滚动插件。它能让你轻松的创建内容滚动的效果,具有非常高的可定制性。开发者可以使用Flexslider轻松创建各种图片轮播效果、焦点图效果、图文混排滚动效果。 查看演示 下载源码 Flexslider具有以下特性: 支持滑动和淡入淡出效果。 支持水平、垂直方向滑...

             时间 : 2014-09-27| 栏目 : js知识| 浏览 : 266 次| [阅读全文]

          页面右侧浮动固定层返回顶部按钮带二维码展示功能

          移动互联网时代的到来,大家可以通过“扫一扫”功能轻松在移动端获取需要的信息。今天我给大家分享一个WEB功能,它是一个漂浮在网页的右侧的小工 具条,我们可以使用它上下快速定位页面位置,可以弹出微信二维码或者页面地址二维码,让喜欢在手机等移动设备上阅读的朋友轻松获取信息。 查看演示 下载源码 HTML 首先我们准备右侧浮动层的内容,...

               时间 : 2014-09-27| 栏目 : js知识| 浏览 : 414 次| [阅读全文]

            使用moment.js轻松管理日期和时间

            大家在前端Javascript开发中会遇到处理日期时间的问题,经常会拿来一大堆处理函数才能完成一个简单的日期时间显示效果。今天我给大家介绍一个轻量级的Javascript日期处理类库:moment.js,使用它可以轻松解决前端开发中遇到的种种日期时间问题。 查看演示 下载源码 moment.js不依赖任何第三方库,支持...

                 时间 : 2014-09-27| 栏目 : js知识| 浏览 : 247 次| [阅读全文]

              详解CSS网页布局中默认字体样式

              浏览器默认的样式往往在不同的浏览器、不同的语言版本甚至不同的系统版本都有不同的设置,这就导致如 果直接利用默认样式的页面在各个浏览器下显示非常不一致,于是就有了类似YUI的reset之类用来尽量重写浏览器的默认设置保证各个浏览器样式一致性的做法。 拿字体来说,各个浏览器默认的字体种类、字体大小和字体行高都不一样,比如IE...

                   时间 : 2014-09-27| 栏目 : 常见问题| 浏览 : 222 次| [阅读全文]

                CSS布局:让页底内容永远固定在底部

                我们在设计一些页面内容甚少的网页时(典型应用就是登陆页面),由于显示器的分辨率大,在正常情况下,假如页面内容高度小于浏览器高度时,页面底部以下会留下很大的空间... 先看示例:http://www.helloweba.com/demo/cssfooter/demo1.html 不管浏览器的高度怎么变化,我们要想让页底内容始...

                     时间 : 2014-09-27| 栏目 : css知识, html知识| 浏览 : 236 次| [阅读全文]

                  有关CSS透明技巧的介绍

                  这篇汇总主要是提供一些CSS不透明的详细介绍,代码示例和解释,以实现这项有用的CSS技术在您的项目中兼容所有浏览器。 关于CSS 透明度,有一点需要注意的是,它虽然使用了很多年,但它一直以来都不是一个标准属性。它是一种非标准技术,应该是CSS3规范的一部分。 一、旧的Opacity设置 以下代码是Firefox和Safari...

                       时间 : 2014-09-27| 栏目 : css知识| 浏览 : 278 次| [阅读全文]

                    CSS原理与CSS经验分享

                    很多人用了很久的css却从来也不知道css是怎么去工作的,写出来的css浏览器是怎么样去解析的呢?所以往 往在一定阶段之后,就变成了进一步提高css水平的一个瓶颈。我将从以下进行分析。早期的网页浏览器只支援简易版本的HTML。 专属软件的浏览器的迅速发展导致非标准的HTML代码的产生。但随着HTML的成长,为了满足设计师的要求,...

                         时间 : 2014-09-27| 栏目 : css知识| 浏览 : 351 次| [阅读全文]