随笔分类 -  CSS/HTML

仿腾讯QQ竖直滑动导航菜单
摘要:菜单就像qq软件的分组,鼠标经过自动显示相应组的内容。效果体验网址:http://keleyi.com/a/bjad/nf86w2dv.htm以下是源代码: 1 2 3 仿腾讯QQ竖直滑动导航菜单-柯乐义 4 5 56 57 58 59 60 Javascript 61 日期选择输入js控件JS错误引发、捕捉和处理js数组的增删访问排序等操作 62 js桌球小游戏 js实现旋转的3D球体标签云使用js判断是否按下了Shift键 63 js判断鼠标左、中、右键哪个被点击谷歌粘土js特效js获取网址中某个参数的值 64 JSLint介绍JS输入用户名自动显示邮箱后缀... 阅读全文
posted @ 2014-01-16 00:57 计划 阅读(1355) 评论(0) 推荐(0) 编辑
css制作漂亮彩带导航条菜单
摘要:点击这里查看效果:http://keleyi.com/keleyi/phtml/divcss/17.htm效果图:以下是源代码: 1 2 3 4 5 css制作漂亮彩带导航条菜单-柯乐义 6 7 23 24 25 26 27 28 29 30 31 32 圣诞快乐33 雪花效果34 WinForm35 放大镜36 javaScript37 jQuery38 39 40 41 42 43 44 45 原文... 阅读全文
posted @ 2014-01-14 22:37 计划 阅读(3281) 评论(2) 推荐(0) 编辑
CSS制作凹环特效
摘要:就是在地面上打凿出凹的圆环效果,利用linear-gradient线性渐变增强内环质感,再用伪类after元素设置中心圆凸块的位置以及大小与跟内环之间的阴影度,然后设置内环的颜色就行了;第四个环上面的第二小凸块也同样适用伪类after元素然后设置z-index的顺序。在linear-gradient段内可以见到各种浏览器支持提示,Firefox Chrome完美效果,IE8以下效果不怎么样, 如果IE采用css3pie.com的htc插件应该会好一些。点击这里查看效果代码如下: 1 31 32 33 34 35 原文36 37 38 39 转载自:http://keleyi.com/a/bja 阅读全文
posted @ 2013-12-03 21:49 计划 阅读(2606) 评论(0) 推荐(0) 编辑
中文字体font-family常用列表
摘要:Windows的一些:黑体:SimHei宋体:SimSun新宋体:NSimSun仿宋:FangSong楷体:KaiTi仿宋_GB2312:FangSong_GB2312楷体_GB2312:KaiTi_GB2312微软雅黑体:Microsoft YaHei装Office会生出来的一些:隶书:LiSu幼圆:YouYuan华文细黑:STXihei华文楷体:STKaiti华文宋体:STSong华文中宋:STZhongsong华文仿宋:STFangsong转载自:http://keleyi.com/a/bjac/vmhk46kx.htmweb前端:http://www.cnblogs.com/jihua 阅读全文
posted @ 2013-11-27 11:35 计划 阅读(33716) 评论(0) 推荐(0) 编辑
keleyi菜单0.1.5版本发布了
摘要:keleyi菜单是一个让你轻松创建向上弹出菜单的jquery插件。最新版本0.1.5增加了显示三角形的功能,当一级菜单包含有子菜单时,会在一级菜单的右侧显示一个小三角形。如图所示:查看例子:http://keleyi.com/keleyi/下载地址:http://files.cnblogs.com/jihua/jquerymenu.rarkeleyi菜单帮助 阅读全文
posted @ 2013-11-19 20:15 计划 阅读(1283) 评论(0) 推荐(0) 编辑
向上弹出菜单jQuery插件
摘要:插件名:柯乐义英文名:Keleyijs文件名称:jquery.keleyi.js插件功能:该插件可以让你轻易地在页面上构建一个向上弹出的二级菜单。示例查看:http://keleyi.com/keleyi/更多示例:0123456789101112从示例可以看出,Keleyi这个菜单插件使用方便,可以灵活自定义多种样式,包括颜色,位置,菜单项宽度等等。下面给出一个示例的HTML文件代码: 1 2 3 4 Keleyi(jQuery Menu Plugin) - keleyi.com 5 6 7 14 15 16 Keleyi17 A jQuery Menu Plugin 18 19... 阅读全文
posted @ 2013-11-06 11:00 计划 阅读(6523) 评论(0) 推荐(0) 编辑
多彩图标按钮动画下拉菜单
摘要:支持IE、Chrome、火狐等多种浏览器。效果预览可以点击这里查看:http://keleyi.com/keleyi/phtml/menu/2.htmHTML源代码: 1 2 3 4 5 多彩图标按钮动画下拉菜单-柯乐义 6 7 8 9 10 11 12 13 14 15 16 17 18 原文多彩图标按钮动画下拉菜单19 20 21 22 23 24 Javascript25 jQuery26 HTML527 web前端28 29 30 31 32 33 三级菜单图片走马灯jQ的toggle34 35 36 37 38 39 40 使a链无效ready的简写41 42 43 4... 阅读全文
posted @ 2013-10-09 20:16 计划 阅读(1329) 评论(0) 推荐(0) 编辑
多个漂亮的按钮样式和图片集合
摘要:效果预览:http://keleyi.com/keleyi/phtml/divcss/7.htmhtml完整代码: 1 2 3 4 多个漂亮的按钮样式和图片集合 -柯乐义 5 6 7 8 9 10 漂亮的按钮样式和图片集合11 柯乐义网站出品(http://keleyi.com)12 13 原文14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 ... 阅读全文
posted @ 2013-09-28 02:20 计划 阅读(3125) 评论(4) 推荐(0) 编辑
Web前端资源汇总
摘要:本文地址:http://www.cnblogs.com/jihua/p/webfront.html 网页特效库 华山论剑HTML5特效 2017新年快乐特效 CSS3+jQuery实现时钟插件 Html5入门实例"Far away from home" jQuery网页版五子棋小游戏源码下载 一句j 阅读全文
posted @ 2013-09-27 23:16 计划 阅读(84241) 评论(2) 推荐(13) 编辑
CSS实现弹出导航菜单
摘要:查看实际效果:http://keleyi.com/a/bjac/vksd7321.htm完整代码,保存在html文件打开也可看到效果:CSS导航条-柯乐义ASP.NET基于微软.NET的编程平台PHP使用最多的WEB开发语言AJAX实现网页交互式设计左侧可弹出隐藏divC#.NET新一代微软平台编程语言JAVA最有前途的编程语言DELPHI最具潜力的编程语言 阅读全文
posted @ 2013-09-26 17:06 计划 阅读(7839) 评论(0) 推荐(0) 编辑
多个精美的导航样式web2.0源码
摘要:效果体验:http://keleyi.com/keleyi/phtml/divcss/6.htm兼容多浏览器,例如IE,Chrome,火狐 等。完整代码,保存到htm文件打开也可以查看效果: 1 2 3 4 5 20个web2.0导航样式-柯乐义 6 7 8 9 10 11 12 13 Blog 14 Themes 15 Service 16 About 17 Help 18 19 20 21 22 23 24 25 26 Blog 27 Themes 28 Service 29 About 30 Help 31 32 33 34 ... 阅读全文
posted @ 2013-09-21 22:54 计划 阅读(2097) 评论(0) 推荐(0) 编辑
jQuery实现侧边导航栏效果
摘要:效果图:效果体验:http://keleyi.com/keleyi/phtml/jqmenu/2.htm以下是完整代码: 1 2 3 4 5 6 7 jQuery高级可停靠侧边栏_柯乐义 8 9 10 64 65 66 67 68 69 固定隐藏链接 70 CMS.NETJavascriptjQueryC#ASP.NETMVCHTML5 71 web前端SQL ServerC++汇编语言分类汇总其他最新文章JS正则表达式 72 73 74 75 76 固定隐藏游戏 77 HTML5捕鱼游戏 78 不上不下 79 打地鼠 80 猜数字 81 ... 阅读全文
posted @ 2013-09-16 14:20 计划 阅读(30409) 评论(1) 推荐(2) 编辑
HTML5锚点请用id代替name
摘要:HTML5已经去掉name属性,实现锚点时请使用id,实例效果:http://keleyi.com/keleyi/phtml/html5/9.htm支持Chrome,火狐,IE8以上等浏览器。以下是完整代码:HTML5锚点实例--柯乐义柯乐义 HTML5锚点 keleyi.com转到底部请滚动鼠标使页面向下www.keleyi.com欢迎hi绿色箭头图片返回顶部效果蓝色方块返回顶部纯文本返回顶部漂亮的返回顶部、底部和留言keleyi.comkeleyikeleyi.com柯乐义柯乐义 监视下滚像素keleyi.comjquery原文keleyi.com完整代码HTML5已经去掉name属性,实 阅读全文
posted @ 2013-08-22 17:24 计划 阅读(1224) 评论(0) 推荐(0) 编辑
css中white-space的值pre-wrap
摘要:CSS中white-space属性设置如何处理元素内的空白。默认值normal表示:空白会被浏览器忽略。white-space这个属性声明建立布局过程中如何处理元素中的空白符。值 pre-wrap 和 pre-line 是 CSS 2.1 中新增的。在IE8以上和火狐、Chrome中有效。pre-wrap表示:保留空白符序列,但是正常地进行换行。柯乐义pre-wrap10个空格 keleyi.com柯乐义normal10个空格 keleyi.com柯乐义nowrap10个空格 keleyi.com柯乐义。keleyi.com 。这是一些文本... 阅读全文
posted @ 2013-08-18 16:29 计划 阅读(13839) 评论(0) 推荐(2) 编辑
div+css背景渐变色代码示例
摘要:用CSS使DIV背景颜色渐变,适用于IE和Chrome等浏览器。从黄到红示例:http://keleyi.com/keleyi/phtml/divcss/2.htm代码: 用CSS是div颜色渐变:从绿到红keleyi.com 效果图:另外多浏览器兼容代码:FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#b8c4cb,endColorStr=#f6f6f8); /*IE*/background:-moz-linear-gradient(top,#b8c4cb,#f6f6f8);/. 阅读全文
posted @ 2013-06-23 01:56 计划 阅读(13354) 评论(0) 推荐(0) 编辑
图片效果集合(js、jquery或html5)
摘要:1.jQuery HTML5 幻灯片使用支持HTML5的浏览器会有特殊效果,即切换图片时颜色的改变文章:http://keleyi.com/a/bjac/b8i3xdui.htm效果:http://keleyi.com/keleyi/phtml/html5/1.htm2. jQuery图片延迟加载一开始不加载实图,只用灰图占位,当图片出现在视线中才加载实图,减少对服务器的压力。效果网址:http://keleyi.com/keleyi/phtml/image/index.htm文章网址:http://keleyi.com/a/bjac/et551617.htm3.jquery使用ColorBo 阅读全文
posted @ 2013-06-20 22:56 计划 阅读(2740) 评论(0) 推荐(0) 编辑
js+div+css下拉导航菜单完整代码
摘要:效果预览:http://keleyi.com/keleyi/phtml/menu/1.htmjs+div+css下拉导航菜单完整代码:<!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>cs 阅读全文
posted @ 2013-06-15 21:41 计划 阅读(1870) 评论(1) 推荐(1) 编辑
使position:fixed的DIV居中
摘要:先看一下效果:http://www.keleyi.com/keleyi/phtml/fixedcenter.htm关键代码是:#topmenu_keleyi_com{position:fixed;left:0px;right:0px;width:706px;margin-left:auto;margin-right:auto;}附完整代码:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transiti 阅读全文
posted @ 2013-05-14 04:03 计划 阅读(1560) 评论(3) 推荐(0) 编辑
使用jQuery UI修饰title属性的气泡悬浮框
摘要:使用jQuery UI的tooltip()函数,可以使悬浮提示框不再那么千篇一律。点击这里先看看效果吧:http://www.keleyi.com/keleyi/phtml/tooltip/以下是完整代码:保存到html文件打开也可以看效果。<!doctype html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>使用jQuery UI修饰title属性的气泡悬浮框 阅读全文
posted @ 2013-05-13 20:35 计划 阅读(2819) 评论(0) 推荐(0) 编辑