jQuery边框圆角插件:DivCorners

什么是 DivCorners?

这个插件的主要作用是建立一个简单的方法为屏幕上的内容增加边界样式。

  1. 边界样式可以是圆角,简单的边界,褪色的边缘,盒布局等。
  2. 使用现有的图片来生成样式,我会完善函数,使在没有图片的情况下也能生成边界样式的。

它有三个可在jquery.js和jquery.divcorners.js加载后调用的函数。

  1. 使用 $(expression).dcCreate( object [, boolean] ) 创建布局的实例。
  2. 使用 $(expression).dcResize( [boolean] ) 重新调整布局的一个实例。
  3. 使用 $(expression).dcClear( [boolean] ) 消除布局的实例。

DivCorners是由jquery.divcorners.js和jquery.divcorners.css构成的,两者必须结合起来使用。

为什么选择 DivCorners?

“jQuery 是一个快速的,简洁的 javaScript 库,使用户能更方便地处理 HTML documents、events、实现动画效果,并且方便地为网站提供 AJAX 交互。 jQuery改变了书写JavaScript的方法。”jQuery.com

这个插件是为了使工作更加简单。 使用 DivCorners可以节约一半时间去完成兼容各种浏览器的预期效果。此插件还修复了IE6下PNG图片透明显示问题。

怎么使用 DivCorners?

$(expression).dcCreate( object [, boolean] )

// This is the maximum definition
  $("div").dcCreate({
      imgPrefix: "/images/",
      fileType: ".gif",
      expand: 4,           // optional
      radius: 0,           // optional, Note: Radius must be greater than expand. See Understand the Parameters
      position: "inside",  // optional
      resize: "img",       // optional
      exclude: "left, top" // optional
  }, true);                // Note: This parameter is optional. By default it's true.
                           // This parameter controls whether parent .dCorner instances will be resized.
 
// This is the recommended definition
  $("div").dcCreate({
      imgPrefix: "/images/dCorner-",
      fileType: ".gif",
      expand: 10
  });

$(expression).dcResize( [boolean] )

// Call this function when the height or width of the container is altered.
  $("div").dcResize(true);
 
// This is the recommended definition
  $("div").dcResize();
 
// Note: This function's parameter is optional. By default it's true.
// This parameter controls whether parent .dCorner instances will be resized.

$(expression).dcClear( [boolean] )

// Call this function to remove any instances.
  $("div").dcClear(true);
 
// This is the constructor definition
  $("div").dcClear();
 
// Note: This function's parameter is optional. By default it's true.
// This parameter controls whether parent .dCorner instances will be resized.

官方网址:http://roydukkey.com/divcorners/

文章标签:

引用地址:http://www.biaodianfu.com/divcorners.html

4 条关于“jQuery边框圆角插件:DivCorners”的回复

  1. orzFly 说:

    页面错位了。改改

发表评论




想让您的头像与众不同,请注册Gravatar