首页风格
门户
博客

GBin1博客视图 - 最近发布的文章-demo

分享一个jQuery的模糊插件 - Blur.js

Blur.js

在线演示  本地下载

今天我们分享一款jQuery的模糊插件 - Blur.js,这款jQuery插件可以帮助我们针对页面元素生成覆盖的模糊元素,使用这个插件可以帮助我们生成超酷的模糊效果,希望大家喜欢!

主要特性

  • 基于StackBlur算法
  • 支持所有主流浏览器
  • 支持生成圆形模糊效果
  • 支持悬浮覆盖效果
  • 支持图片缓存,以用于以后显示
  • 支持拖放效果

如何使用

我们可以指定生成模糊的目标元素或者整个body,代码如下:

基本使用:

$('.target').blurjs({
    source: 'body',
    radius: 7,
    overlay: 'rgba(255,255,255,0.4)'
}); 

缺省值:

$('.target').blurjs({
source: 'body', //Background to blur…

标签: jquery插件, 模糊效果, 模糊效果插件, jquery模糊插件, blur

阅读更多

分享一个CSS3和jQuery实现的模糊显示效果 - 帮助你的访问用户更好的阅读内容

日期:2011/12/20  来源:GBin1.com

分享一个CSS3和jQuery实现的模糊显示效果 - 帮助你的访问用户更好的阅读内容

在线演示  本地下载

这个教程将实现一个页面部分内容突出显示效果, 大家可能经常见到一些页面组成内容比较多,可能会分散用户的关注点,使用部分内容突出显示,而模糊其它内容会使得用户能够比较专著的阅读页面中自己关心或者感兴趣的内容,今天这个突出内容显示效果就是为了解决这个问题而设计的。

在这个教程中,我们使用了CSS3的transition属性,所以你需要使用现代浏览器来浏览效果,比如:Safari和Chrome。

HTML标签

以下HTML标签包含了页面中需要显示的众多内容块:

<section class="ib-container" id="ib-container">
<article>
<header>
<h3><a href="#">Some…

标签: HTML, CSS, Javascript, JQuery, css3悬浮模糊效果, jQuery模糊悬浮, 模糊, 动画, box阴影, 文字阴影, blur, css3, transition, jquery, box shadow, text shadow, articles, scale, transform, animation

阅读更多

喜欢我们的文章请您与朋友分享:

?ü?à

今日推荐