用css设置webkit内核浏览器的滚动条主要设置以下7个属性： 1.::-webkit-scrollbar /*滚动条整体部分，可以设置宽度高度*/ 2.::-webkit-scrollbar-button /*滚动条两端的按钮*/ 3.::-webkit-scrollbar-track /*外层轨道*/ 4.::-webkit-scrollbar-track-piece /*内层滚动槽*/ 5.::-webkit-scrollbar-thumb /*滚动的滑块*/ 6.::-webkit-scrollbar-corner /*边角*/ 7.::-webkit-resizer /*定义右下角拖动块的样式*/ ...
最近封装上瘾，想起以前做的一个轻巧的弹出框，是样式和脚本分离的，于是重新封装了一下，把样式标签统一到js里了。里面还有一些问题，但不影响使用，有兴趣的同学，可以参考完善下，有好的建议，请不吝赐教。 var PopDialogDefaultConfig = { hasCover: true, //是否带遮罩层 colorOfCover: "#000", //遮罩层颜色 transparencyOfCover: 80, //遮...
今天给大家介绍个好玩的东西，很简单。 大家是否经常在别人博客园个人首页公告处看到自定义的时钟啊什么的，今天我也来一个。 先看效果图： 源码奉上 大家只需要把上面这段代码拷贝到博客园设置里的侧边栏代码框里，就可以在自己的博客首页炫酷一把了，赶紧行动吧~
公司最近要做组件库，一些单选框，复选框，下拉菜单都需要美观自定义， 闲余时间做了一个（对浏览器要求较高的）下拉菜单的组件。 /*********实现功能 start **************/ 通过css伪类:focus实现下拉菜单基本功能 select: 点击菜单(动画过渡)展开,再次点击(动画过渡)收起; 并保证点击页面空白处和选择option同样(动画过渡)收起菜单。 option: 限制5条内容的高度，超出则滚动条，反之则自适应高度; /********...
在jQuery的attr与prop提到过在IE9之前版本中如果使用property不当会造成内存泄露问题，而且关于Attribute和Property的区别也让人十分头痛，在HTML5中添加了data-*的方式来自定义属性，所谓data-*实际上上就是data-前缀加上自定义的属性名，使用这样的结构可以进行数据存放。使用data-*可以解决自定义属性混乱无管理的现状。 读写方式 data-*有两种设置方式，可以直接在HTML元素标签上书写 Click Here 其...
前言 已经好几天没玩LOL了，实在手痒，下载了游戏，又卸载了，坦言：毛爷爷说的”好好天天向上“，真不容易。但还是回到学习个状态了，开始写，就“根本停不下来”，我也慢慢感受到代码的快乐了，并且想总结出一套学习IT语言及项目的方法，并加强培养锻练。话不多说，看看这几天的学习结果 内容 Demo下载地址：点这里 后记：想了解这个Demo，请看前两篇文章 计划: Jekyll主题-还有三个页面就可...
来CSDN的处女问呢： 故事起因于我要单纯地用css自定义一个checkbox的样式，然后我是这样做的： input[type="checkbox"]{opacity:0;}input[type="checkbox"] + label:before{background:#d5d5d5; content:""; height: 15px; width: 15px; position: absolute; top: 0; left: 0; } 以上方法我是效仿iCheck插件写的。BUT导师说我的方法不行啊（摔！） 他说：id 滥用会导致日后id重名排查...
1，起因 最近在工作中要实现自定义式的radio样式，而我们通常使用的时默认的样式，因为自己实在想不到解决的方法，于是开始搜索，最终看到了不错的解决办法，可以完美解决我们遇到的问题。 2，原理 大家都知道在写结构的时候，radio或checkbox都会跟随label一起使用，label的for属性值和input的id值相同的情况下，点击label就可以选中input，这里正是利用label 来覆盖我们的input默认样式，通过给label添加背景图片（美化的c...
昨天我们介绍了Animation的基本用法。小伙伴们了解的怎么样了？如果还没有了解过Animation的小伙伴可以看看这篇博客 android动画介绍--Animation 实现loading动画效果 安卓内置的四种动画虽然说可以用AnimationSet进行组合操作，但是这些组合往往在特定场合是不够用的，就像view一样，我们可以自定义动画效果。 今天要做成的效果是模仿qq的抖一抖效果，老规矩，先来看今天的效果图： 自定义动画的实现方法为 继承Animation类...
举个例子，一个web商场的用户购物车里有50项道具，每个道具是一个div，需要把道具id作为一个重要的自定义信息添加到每个div元素的属性里（以方便jquery随时捕捉），比如这个属性的值是item-123456，那么我应该把id,class还是name定义为item-123456？还是有别的更好的办法？ 补充1：不会为同一个元素添加超过1条类似的自定义信息，因为所谓自定义信息，主要就是web应用中某个概念的id 补充2：假定可能出现两个id相同的道具分开作...
CSS如何实现自定义链接提示: 在默认状态下可以使用标签的title属性实现链接提示效果。例如: 蚂蚁部落蚂蚁部落 虽然上面的代码能够实现链接提示效果，但是往往并不能够满足实际需求，可能需要自定义更为美观或者与页面相搭配的链接提示效果。 代码实例如下: 蚂蚁部落ul { list-style: none; font-size: 14px;}li { width: 100px; height: 30px; line-height: 30px; float: left; text-al...
本篇体验在Axure中自定义部件，并熟悉Widget Interations and Notes面板，Widget Properties and Style面板，Widget Manager面板。 在Axure中如何自定义部件Widget呢？ 点击"Widgets"面板中的"Options"下的"Create Library"，点击"完成"Axure随即启动打开一个Widget的编辑器，在新建的部件库已经有了一个默认的部件。 双击部件名称，可以打开该部件的显示页。 点击Custom Widget Library左上方的加号，...
1. Html 实例 OwlSalmonTarantula 2.浏览器支持 IE Firefox Chrome Safari Opera支持 支持 支持 支持 支持 3.定义和用法data-* 属性用于存储页面或应用程序的私有自定义数据。data-* 属性赋予我们在所有 HTML 元素上嵌入自定义 data 属性的能力。存储的（自定义）数据能够被页面的 JavaScript 中利用，以创建更好的用户体验（不进行 Ajax 调用或服务器端数据库查询...
实现自定义的手型气泡提示 .test{ background: #CE5010 none repeat scroll 0% 0%; position: relative; border-radius: 20px; margin: 60px; height: 2em; text-align: center; float: left; color: white; padding-left: 10px; padding-right: 10px; padding-top: 5px; font-size: 12px; } .test span.bot{ width: 0; heig...
今天我们要来分享一款基于纯CSS的气泡提示框，和之前分享的一款jQuery消息提示框插件Tipso类似，整个提示框由箭头和矩形框组成，并且气泡提示框的箭头可以有不同的方向。这款CSS气泡提示框由纯CSS完成，最大的特点就是可以自定义配置，包括文字颜色、背景颜色和箭头方向等。效果图如下： 在线预览 源码下载 实现的代码。 css代码： .arrow_box { position: relative; background: #88b7d5; border: 4px...