- 浏览: 536063 次
- 性别:
- 来自: 北京
文章分类
- 全部博客 (174)
- Groovy (28)
- Grails (14)
- DHTML (5)
- JS (4)
- jQuery (16)
- JAVA (16)
- Eclipse (4)
- Hibernate (2)
- Resin (2)
- Oracle (25)
- Maven (4)
- Struts2 (1)
- WebWork2 (3)
- Tomcat (2)
- Windows7 (4)
- Griffon (2)
- PowerDesigner (1)
- Pro*C (2)
- JDK (1)
- 乱码 (2)
- WebService (3)
- .NET (1)
- 性能 (2)
- 安装 (1)
- 命令行 (1)
- function (1)
- type (1)
- Mysql (1)
- 同步 (1)
- Synchronized (1)
- json (3)
- Office (1)
- Visio (1)
- 自定义形状 (1)
- jsong (0)
- gson (1)
- fastjson (1)
- EM (1)
- DB2 (6)
- Sequence (1)
- RHEL5.x (1)
- WAS6.1 ND (1)
- SQL (1)
- -964 (1)
- Linux (4)
- Date (1)
- Format (1)
- Add (1)
- SHELL (1)
- CSS (2)
- Bootstrap (1)
- nginx (1)
- Openresty (2)
- JWPlayer (1)
- showdoc (1)
- 常用网址 (1)
- lua (2)
- SpringBoot (1)
- Office pdf linux (1)
最新评论
-
纵观全局:
Great
阿里巴巴开源JSON解析组件FastJson简单使用笔记 -
guxuede:
...
Groovy编程技巧 -
a1439226817:
groovy用的多吗?我还没发现有哪个java项目在用这个?
Groovy同步 -
晴子9034:
在网上搜到的几乎全是说满了就扩充。但是我有个疑问,满了就扩充, ...
解决DB2 SQLCODE=-964日志文件满的问题 -
在世界的中心呼喚愛:
好东西啊,就用这个包。
阿里巴巴开源JSON解析组件FastJson简单使用笔记
效果:
参考了:http://www.iteye.com/topic/610962
round.css:
body { font-family: 宋体; } .b1 { height: 1px; font-size: 1px; overflow: hidden; display: block; background: #B2D0EA; margin: 0 3px; clear:both; } .b2 { height: 1px; font-size: 1px; overflow: hidden; display: block; background: #EDF7FF; border-right: 2px solid #B2D0EA; border-left: 2px solid #B2D0EA; margin: 0 1px; clear:both; } .b3 { height: 1px; font-size: 1px; overflow: hidden; display: block; background: #EDF7FF; border-right: 1px solid #B2D0EA; border-left: 1px solid #B2D0EA; margin: 0 1px; clear:both; } .bc { font-size: 12px; overflow: hidden; display: block; background: #EDF7FF; border-right: 1px solid #B2D0EA; border-left: 1px solid #B2D0EA; margin: 0 0px; clear:both; } .bt { background: #EDF7FF; margin:0 2px; padding:3px; } .bb { background: #FFFFFF; margin:0 2px; padding:5px; } /**另一种颜色*/ .bb1{background: #B8E7B3;}/*边框线最外层背景颜色*/ .bb2{background: #E7F9E3;border: #B8E7B3;}/*边框线的背景和边框线颜色*/ .bb3{background: #E7F9E3;}/*标题背景颜色*/
round.js:
(function($) { $.fn.round = function(opts) { //默认参数设置 var defaultSettings = { title: "标题" }; var settings = $.extend({}, defaultSettings, opts); var _title = settings.title ? settings.title : defaultSettings.title; var _content = settings.content ? settings.content : ""; this.append("<b class='b1'></b><b class='b2'></b><b class='b3'></b>"); this.append("<div class='bc'><div class='bt'>" + _title + "</div><div class='bb'>" + _content + "</div></div>"); this.append("<b class='b3'></b><b class='b2'></b><b class='b1'></b>"); }; })(jQuery);
html:
<!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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title> 圆角样式 </title> <meta name="generator" content="editplus" /> <meta name="author" content="" /> <meta name="keywords" content="" /> <meta name="description" content="" /> <link rel="stylesheet" type="text/css" href="round.css" /> <script src="http://www.google.com/jsapi"></script> <script> google.load("jquery", "1.3.2"); </script> <script src="round.js"></script> <script> $(document).ready(function(){ $("#t").round({content: "这里是内容"}); $("#t1").round({title: "我是标题", content: "这里是内容"}); }); </script> </head> <body> <div id="t"></div><hr/><div id="t1"></div> <!-- <div> <b class="b1"></b><b class="b2"></b><b class="b3"></b> <div class="bc"> <div class="bt">标题</div> <div class="bb">圆角三边 这里是内容</div> </div> <b class="b3"></b><b class="b2"></b><b class="b1"></b> </div> <hr/> <div style="width:350px;"> <b class="b1 bb1"></b><b class="b2 bb2"></b><b class="b3 bb2"></b> <div class="bc bb2"> <div class="bt bb3">另一种颜色</div> <div class="bb"><p>另一种颜色 这里是内容</p></div> </div> <b class="b3 bb2"></b><b class="b2 bb2"></b><b class="b1 bb1"></b> </div> --> </body> </html>
具体内容参见附件!
比较简单,不要见笑啊!
发表评论
-
Bootstrap下拉菜单美化插件
2013-05-08 17:45 8595<!doctype html&g ... -
典型的Jquery Ajax请求示例
2012-06-28 10:31 1374$.ajax({ url: contextPath+& ... -
几个Jquery UI框架(非JQuery UI)
2011-05-20 11:43 51601. DWZ 官方网址:http://code.goog ... -
转:jquery在div中显示日期、时间的插件!
2010-06-04 14:59 1437原贴地址:http://mamaoyuan625.iteye. ... -
转:jquery日期插件!
2010-06-04 14:39 1141原贴地址:http://atrl.name/archives/ ... -
纯手工验证表单输入值
2010-03-31 09:50 1093function validate(){ var _i ... -
(转)基于jQuery的GridView-Flexigrid(2)-扩展和修复
2010-03-25 17:57 1353原贴地址:http://www.cnblogs.com/xua ... -
jQuery使用Ajax填充select
2010-03-05 14:14 6265function ajaxAddOptions(url, ... -
(转)jQuery ajax填充select的插件
2010-03-05 10:51 3509注意:这个与jquery easyui插件有冲突,使用 ... -
jQuery提交参数返回数据并显示在div中
2010-03-03 15:17 2066$('#post').load('test', {info: ... -
使用google jsapi快速载入jquery库(动态增加input并取值)
2010-03-03 15:09 2089<!DOCTYPE HTML PUBLIC &qu ... -
JQuery生成带文字的input框
2010-03-03 14:33 1445var msg = "测试:"; ... -
JQuery获取FCKEditor的值
2010-03-02 17:35 2831参考:http://home.phpchina.com/spa ... -
jquery获取radio的几种方法
2010-03-02 11:57 13261. 直接获取页面所有radio被选中的值 $ ... -
jquery遮罩
2010-01-26 15:05 2035转自:http://www.jb51.net/article/ ...
相关推荐
jQuery Corners插件的出现,极大地简化了这一过程,使得在JavaScript的辅助下,我们可以轻松地为元素添加圆角效果。本文将详细介绍jQuery Corners插件的使用方法、功能特性以及实际应用。 一、jQuery Corners插件...
如果设置两个值,第一个代表上下半径,第二个代表左右半径。 2. **兼容性**: CSS3的`border-radius`在现代浏览器中得到了广泛支持,包括Chrome、Firefox、Safari、Opera和Internet Explorer9及以上版本。对于IE8...
除了上述方法,还可以通过改变背景图片或者创建多个内嵌 div 来实现圆角效果,但这些方法在维护性和效率上可能不如使用 `border-radius` 或 jQuery 插件。随着技术的发展,如今大部分浏览器都已经支持 `border-...
圆角矩形对话框的设计理念在于创造一个视觉上更为柔和且不那么生硬的界面元素,这有助于提升用户的浏览体验,并使界面看起来更加现代和精致。 首先,我们要理解“对话框”的概念。对话框是在用户与应用程序之间进行...
// 初始化第一个滚动条 $('.scrollbar1').customScrollbar(); // 初始化第二个滚动条 $('.scrollbar2').customScrollbar({ thumbHoverColor: '#ff0000' // 设置滑块悬停时的颜色 }); ``` ### 四、插件使用方法 1...
6. **动画插件**:jQuery有许多插件可以增强动画效果,例如`jQuery.animate()`或第三方插件如`jQuery.EasIng`。这些插件可以提供更复杂的动画控制,如自定义缓动函数、延迟、持续时间等。 7. **页面结构与布局**:...
本文的圆角插件则是通过在元素周围添加多个1px的div,并给这些div设置相应的样式来模拟实现圆角效果的。 知识点七:jQuery.extend()的使用 jQuery.extend()是jQuery库中的一个函数,用于将两个或多个对象的内容...
一款jQuery插件slide幻灯片切换图片宽高自适应 74.一款jQuery漂亮淡出淡入焦点大图切换源码 75.一款jquery缩略图商品切换放大展示功能插件 76.一款使用jQuery左右控制横向图片滚动的代码 77.一款基于jquery...
`jQueryPopMenu`是一个针对jQuery设计的轻量级响应式弹出菜单插件。它提供了灵活的自定义选项,帮助开发者轻松创建具有基础响应特性的菜单,使得在不同设备上展示时都能保持良好的用户体验。这款插件特别适合那些...
此外,实现DIV圆角还有其他方法,如使用图片背景、CSS3的剪切(clip)属性,或者是早期的JavaScript库和jQuery插件。然而,随着CSS3的普及,这些方法已经逐渐被淘汰,因为它们在代码复杂性和性能上都不如纯CSS解决...
// 初始状态下隐藏所有内容区,只显示第一个 $('.tab-content').hide().eq(0).show(); // 绑定点击事件 $('.tab-title').click(function(e) { e.preventDefault(); var index = $(this).index(); $('.tab-...
例如,我们可以设置所有的分页项初始时都向左偏移,只显示第一个分页,然后为火狐添加圆角样式,为其他浏览器添加正方形小点样式。 ```css .page { position: absolute; width: 100%; height: 100%; ...
例如,可以创建一个div元素作为转盘容器,其中嵌套多个表示奖品的div,每个div对应转盘上的一块区域。 CSS(层叠样式表)则用于美化和布局HTML元素。在转盘抽奖插件中,CSS3的关键技术被广泛运用,如圆角边框、渐变...
在现代网页设计中,CSS3(层叠样式表第三版)已经成为了不可或缺的一部分,它带来了许多新特性,极大地丰富了网页的表现力。其中,CSS3进度条就是一种常见且实用的元素,它能够以视觉化的方式展示数据加载、任务完成...
jQuery 1.8 是一个重要的版本更新,它是 jQuery 库的里程碑之一。这个版本引入了许多性能优化和API改进,增强了其在现代Web开发中的功能和效率。jQuery 1.8 强调了API的稳定性和向后兼容性,确保开发者在升级时能...
通常,你可以在EasyUI的`div`容器中嵌套一个使用第三方库的`<select>`元素,然后通过EasyUI的事件和方法来同步和控制选择项的状态。 总之,解决"ie8-select滚动条"问题需要结合对CSS、JavaScript(尤其是jQuery和...
如果设置了两个值,第一个值将应用到顶部左右角落,第二个值则应用到底部左右角落。例如: ```css div { border-radius: 10px; } ``` 这将为div的所有四个角落设置10像素的圆角。 2. **特定角落的圆角**: ...
3. **jQuery插件**:虽然描述中没有明确提到特定的jQuery插件,但为了实现某些特效,如平滑滚动、渐显渐隐或者定位,开发者可能会使用一些流行的jQuery插件,如` waypoints.js `(用于在元素进入视口时触发事件)或`...
然后将最后的li元素定时插入到第一个li元素的上方,从而实现内容的连续向下滚动。 知识点4:jQuery插件jquery.corner.js的使用 jquery.corner.js是一个专门用于处理元素圆角的jQuery插件。在本实例中,虽然主要使用...