`
jy00314996
  • 浏览: 75180 次
  • 性别: Icon_minigender_1
  • 来自: 济南
社区版块
存档分类
最新评论

jquery 插件corner实现圆角边框

jQueryJavaScriptIEXHTMLCSS 
阅读更多

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
  <head>    
    <title>jQuery Corners</title>    
<script type="text/javascript" src="jquery.js"></script>    
<script type="text/javascript" src="jquery.corners.min.js">
</script>         
<script type="text/javascript">     
$( function(){$('.roundedd').corners();})     
</script>         
<style type="text/css">   
 .roundedd     {       
 background-color:#eeeeee;   
  }     
</style>      
</head>  
<body> 
<div style="" class="roundedd"> class="rounded {10px}" </div> </body> 
</html>

 

我测试了一下发现一个问题bug：若background-color:#eeeeee;写成background-color:red;或 background-color:yellow;在火狐没问题，如果是IE的话就看不到效果了，所以建议用颜色RGB代码。

演示地址：

http://www.malsup.com/jquery/corner/

分享到：
| 各种效果的jquery ui(接口)介绍
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    jquery插件corner实现圆角边框的方法

    本文实例讲述了jquery插件corner实现圆角边框的方法。分享给大家供大家参考。具体如下： 代码如下:&lt;!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” ...

    Jquery实现圆角边框效果的源码

    jQuery CurvyCorners 是一个流行的jQuery插件，它允许开发者在不支持CSS3圆角的旧版浏览器中实现圆角边框效果。这个插件通过JavaScript动态生成SVG或者VML（在IE6和IE7中）图形，来模拟圆角，从而在各种浏览器中保持...

    jQuery.corner.js

    《jQuery.corner.js：实现DIV圆角的利器》 在Web开发中，为元素添加圆角效果是一项常见的需求，它可以提升界面的美观性和用户体验。jQuery.corner.js 是一个专门用于实现这一目标的JavaScript插件，它让开发者能够...

    jquery实现圆角实例

    jQuery 插件如 "jQuery.corner" 或 "jQuery.roundCorners" 可以帮助我们在这些浏览器中实现圆角效果。但随着技术的发展，如今大多数浏览器都已经支持 CSS3，因此直接使用 CSS3 实现圆角更为推荐。 如果仍需使用 ...

    DIV+CSS 圆角边框

    为了确保在这些浏览器中也能呈现圆角效果，可以使用渐进增强的策略，结合使用像`-webkit-`, `-moz-`, `-ms-`, `-o-`等前缀，或者借助于JavaScript库（如jQuery的Corner插件）来实现跨浏览器的圆角边框。 总结来说，...

    圆角框jquery

    在网页设计中，圆角框是一种常见的视觉元素，它能够为网页界面增添柔和与美观的效果。...4. 第三方 jQuery 插件，如 `jQuery.corner.js`，实现圆角效果。 5. 考虑到兼容性和性能，应优先选择原生 CSS3 解决方案。

    兼容所有浏览器的 Jquery 圆角插件,可配置

    此外，开发者还可以根据需求扩展插件，例如添加动画效果，支持动态改变圆角大小，或者与其他jQuery插件集成。 总的来说，这个兼容所有浏览器的jQuery圆角插件是前端开发者实现跨浏览器圆角效果的一个实用工具。通过...

    jQuery圆角插件

    例如，文档可能包含如何创建动态圆角（当元素尺寸变化时自动调整圆角）、如何与其他jQuery插件兼容，以及如何解决在旧版浏览器中的兼容性问题等内容。 值得注意的是，虽然现代浏览器普遍支持CSS3的border-radius...

    超级好用的jQuery圆角插件 Corner速成

    虽然这种方法在技术层面上并不复杂，但它巧妙地利用了CSS和JavaScript，使得在早期不支持CSS3边框半径的浏览器中也能实现圆角。 该插件主要适用于block元素，如div和p，因为它们天生适合添加圆角效果。然而，对于...

    JQUERY圆角矩形

    首先，jQuery 实现圆角矩形主要是通过 CSS3 的 `border-radius` 属性，但为了兼容不支持此属性的老版本浏览器，我们可以借助于 jQuery 插件来完成。`border-radius` 属性允许我们设置元素边框的圆角半径，创建出圆形...

    jquery 圆角例子

    "jQuery圆角例子"是一个实用的教学资源，它展示了如何使用jQuery插件为HTML元素添加圆角，从而在各种浏览器中实现一致的视觉效果。虽然现代浏览器广泛支持CSS3的`border-radius`，但在考虑兼容性的情况下，这种...

    jQuery Corner 圆角插件实例：各种各样的框角

    内容索引:脚本资源,jQuery,圆角框,jQuery插件　jQuery Corner 是一款用于修饰边框框角的插件，用它可以将你的DIV边框变成圆角、尖角、斜角等各种各样的框角，本实例就是向你展示如何使用jQuery Corner制作这些框角，...

    使表格边框变圆角的技术

    如果确实需要在老版本浏览器中实现圆角边框，可以选择jQuery UI或者其他专为实现圆角效果的JavaScript库，如jQuery Corner或Round corners。这些库通过动态创建额外的元素或者改变元素的背景图像来模拟圆角效果。 ...

    Jquery常用菜单，验证，图片效果等各种插件大全

    8. **圆角边框**：`40-圆角等 JQuery Corner Demo.htm`可能展示了jQuery Corner插件的使用，它可以为元素添加圆角效果，使得界面更加现代和美观。 9. **对话框**：`20 对话模式　SimpleModal_Demos.htm`可能包含...

    jquery 圆角插件 corners 0.3 与实例.rar

    jquery corners 圆角插件，用于修饰各种各样的角为圆角，比如Div边框、TAB按钮、区域边框等，以前有款圆角插件同样也是基于jquery的，好像叫做jQuery Corner，名字也很有相似哦，有希望的可以看看这两款有何不同，...

    jqyery-corner-demo

    "jqyery-corner-demo"是基于jQuery的一个插件，专门用于实现div元素的圆角效果。这个插件使得开发者无需手动编写复杂的CSS3代码，就能轻松地为网页中的各种矩形div添加圆角，极大地提高了开发效率。 首先，我们来...

    JS实现圆角效果

    例如，使用jQuery Corner插件，只需引入jQuery和插件库，然后调用`.corner()`方法即可： ```javascript $(document).ready(function() { $('.rounded-corner').corner("20px"); }); ``` 这种方法更加简洁，适应性...

    jquery corners 圆角插件

    内容索引:脚本资源,jQuery,圆角框,jQuery插件　jquery corners 圆角插件，用于修饰各种各样的角为圆角，比如Div边框、TAB按钮、区域边框等，以前有款圆角插件同样也是基于jquery的，好像叫做jQuery Corner，名字也很...

    CSS3完美支持IE圆角阴影样式.zip

    一种常见的方法是使用jQuery插件，如"jQuery.corner"或"jQuery.roundCorners"。这些插件通过动态创建额外的DOM元素和CSS样式来实现圆角。例如，使用`jQuery.corner`： ```javascript $('.box').corner('10px'); ```...

Magicbox
Global site tag (gtag.js) - Google Analytics