{Javascript}
0/25
{Javascript}
0/102
js获取浏览器下拉条高度ScrollTop经典收藏
糖不甩 / 2012 年 3 月 20 日js获取浏览器下拉条高度ScrollTop，这个脚本片段还是很经典的，配合判断页面滚动条下拉的高度，做不同的效果处理，好用不解释，也完美兼容，记录一下。。。 function getDocumentScrollTop(){ return Math.max(window.document["documentElement"].scrollTop,window.document.body.scrollTop) } window.onscroll=function(){ if(getDocumentScrollTop()>=400){ //.... } else if(getDocumentScrollTop()<10){ //.... } } 记录点滴。
{html5/css3}
0/193
CSS3 Media Queries(媒体查询)
糖不甩 / 2012 年 3 月 7 日最近的项目中需要根据不同的设备屏幕以及不同的浏览器大小，即时显示不同的style，所以需要判断条件了，那么CSS3或者说CSS2就已经有了相关的处理方法, Media Queries直译过来就是“媒体查询”，下面我们一起来看看Media Queries的具体使用方式： 一、最大宽度Max Width下面实例表示的是：当屏幕小于或等于600px时，将采用small.css样式来渲染Web页面 <link rel="stylesheet" media="screen and (max-width:600px)" href="small.css" type="text/css" /> 二、最小...
{Javascript}
2/165
Javascript,JQuery,js 判断邮箱Email格式
糖不甩 / 2012 年 3 月 1 日原生JS 与JQ 同理。 $("#submit").click(function(){ //验证邮箱的正则表达式 var reg = /^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z]+$/; //判断 if(!reg.test($(".user_email").val())){ alert("邮箱格式不对"); return false; } });
{碎碎念}
0/177
小强和小明的故事：都是一辈子。
糖不甩 / 2012 年 2 月 18 日1.小强每天在村里晃悠，爹妈看着发愁，心想这孩子将来怎么办呀；小明每日都苦读诗书，父母喜在心里，村里人都认定他必有出息。 2.那年，小强和小明都是十九岁，小强跟着村里的外出打工，来到了高速公路的工地，保底工资三千块；小明考上了一所重点大学，读的是道路与桥梁专业，学费每年五千多。 3.那年，小强和小明都是二十三岁，小强的爹妈给他说个巧媳妇，是邻村的，特别贤惠；小明在大学里谈了个女朋友，是邻校的，很有文化。 4.那年，小强和小明都是二十四岁，小强在老家结了婚，把媳妇带到工地上，来给他洗衣...
{Javascript}
0/158
基于Tween算法的动画类，各种犀利。
糖不甩 / 2012 年 2 月 13 日基于Tween算法的动画类，各种犀利。 主要是参考了cloudgamer大师的Tween算法及缓动一文，然后再简单地进行了一下封装： /** * obj: DOM id 或 DOM 对象 * prop: 样式属性，如left、width、opacity * v1: 初始值 * v2: 最终值 * obj: { duration: 动画时长(毫秒), tweenType: 缓动类型, callBack: 回调 } * 用法：var t = new Tween('obj', 'left', 0, 800); t.run(); */ var Tween = (function() { /** * t: current time 当前时间 * b: begin value 初始值 * c: changing value 变化...
{Flash/Flex}
0/189
Actionscript 字符串/数字互转。
糖不甩 / 2012 年 2 月 10 日var aaa:int=parseInt(“100″)+200 obj.text=String(aaa);
{Flash/Flex}
0/261
Flex中使用CSS / fx:Style 各种方法教程。
糖不甩 / 2012 年 2 月 1 日Flex中使用CSS Style教程实例，通过css定义，可以批量（或者单独的/针对性的）处理组件，自定义组件，用法与html中的css大同小异。 一.使用标签 MXML 代码： <?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> <mx:Style> Button { color: #ff0000; borderColor: #cccccc; themeColor: #00ff00; fontFamily: ...
{Flash/Flex}
0/252
Flex Animate 动画小例。
糖不甩 / 2012 年 2 月 1 日Flex Animate 动画小例。。 说明：此 Animate 效果可设置各个值之间的任意属性集的动画。通过设置 motionPaths 属性，指定要设置动画的属性和值。 <s:Animate id="cs1effect" target="{targerID}"> <s:motionPaths> <s:SimpleMotionPath property="y" valueFrom="240" valueTo="220"/> <s:SimpleMotionPath property="alpha" valueFrom="1" valueTo="0"/> <s:SimpleMotionPath property=&...
{Flash/Flex}
0/232
Flex Group 添加背景图片和背景色实现方法
糖不甩 / 2012 年 1 月 30 日给Flex的Group 添加背景图片和背景色的实现方法 添加背景图片 <s:Group x="0" y="0" height="580" width="760"> <s:Rect x="0" y="0" height="580" width="760"> <s:fill> <s:BitmapFill source="@Embed('image/bg.jpg')"/> </s:fill> </s:Rect> </s:Group> 添加背景色 <s:Rect alpha="0.5" x="0" y="0" width="100%&q...
{html5/css3}
0/336
CSS3 linear-gradient(线性渐变)和radial-gradient(径向渐变)
糖不甩 / 2012 年 1 月 13 日CSS3 linear-gradient(线性渐变)和radial-gradient(径向渐变)详细解析。 CSS3 Gradient分为linear-gradient(线性渐变)和radial-gradient(径向渐变)。为了更好的应用CSS3 Gradient,我们需要先了解一下目前的几种现代浏览器的内核，主流内容主要有Mozilla（熟悉的有Firefox，Flock等浏览器）、WebKit（熟悉的有Safari、Chrome等浏览器）、Opera（Opera浏览器）、Trident（IE浏览器）。 而我们今天主要是针对linear-gradient(线性渐变)来剖析其具体的用法。 渐变的原理： 渐变的形式——线性渐变还是中心渐变。 渐变...
{html5/css3}
0/243
HTML的Meta标签的使用大全
糖不甩 / 2012 年 1 月 13 日前言： HTML/XHTML/DHTML并不简单，我想就单说一个meta标签都不见得有谁能完全掌握好（也许很多人根本都不会关心它）。 在我刚刚更新了IE到IE9时，发现了一个小现象，就是用IE9打开我做的页面时会出现“Compatibility View”按钮，而访问Google时就没有，这是为什么呢（你会去考虑这个问题吗）？后来多方查找之后才发现了原因，在google的页面源代码里有“<meta http-equiv=”X-UA-Compatible” content=”IE=edge”>”这么一行，就是因为有了它，IE的“兼容性视图”按钮才不显示的。 接下来继续查找meta...
{Javascript}
0/236
IE6 png透明 完美解决方案(img标签 和 ackground)
糖不甩 / 2012 年 1 月 6 日要解决png在ie6下透明的问题，百度搜一下很多。试过iepngfix那个（也就是加上ie6专用的js那段），很有可能造成与jQuery冲突之类的，不是很好用。下面的这段代码是另辟新径，且相当好用。原理：将img标签利用js转换成其他标签比如span,然后给新标签如span以滤镜的方式用background方式来显示。语法：filter : progid:DXImageTransform.Microsoft.AlphaImageLoader ( enabled=bEnabled , sizingMethod=sSize , src=sURL)属性： enabled:可选项。布尔值(Boolean)。设置或检索滤镜是否激活。true | false （这个基本可...
{Javascript}
0/451
javascript，jQuery取消事件冒泡,stopPropagation()
糖不甩 / 2011 年 12 月 27 日语法 .stopPropagation() 定义 不再派发事件。 说明 该方法将停止事件的传播，阻止它被分派到其他 Document 节点。在事件传播的任何阶段都可以调用它。注意，虽然该方法不能阻止同一个 Document 节点上的其他事件句柄被调用，但是它可以阻止把事件分派到其他节点。 不管是jQuery还是原生Javascript 用event.stopPropagation()方法,对于取消事件冒泡来说，一切都不是问题~ DemoDemo下载 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/ht...
{Javascript}
0/338
javascript Drag，js拖拽，js拖动div。
糖不甩 / 2011 年 12 月 25 日周末用原生js写了个拖拽库（Drag.js），嘿嘿其实也不叫库了，就是传参调用函数，没有扩展更多功能，只有最主要的拖拽部分，兼容没什么问题，步骤和原理在Demo的注释里写的很详细了。 原理：当前鼠标位置 – 起始鼠标位置 + 目标位置 DemoDemo下载 调用方法如下~ <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>糖不甩的日记 www.yzzer.com</title> <link type="text/css&...
{碎碎念}
0/264
分享淘宝指数邀请码五枚，要的同学自取~
糖不甩 / 2011 年 12 月 25 日分享淘宝指数邀请码五枚，要的同学自取~（什么是淘宝指数） 1、http://shu.taobao.com/user/invite/329d8476-cbec-4bee-898c-cf614445585d 2、http://shu.taobao.com/user/invite/fd5b6648-d871-4bbc-a1c1-f0143569d38f 3、http://shu.taobao.com/user/invite/d3e308fb-e41c-4476-9391-102126fce353 4、http://shu.taobao.com/user/invite/a415291c-4c66-4ffe-bba5-c02e426da855 5、http://shu.taobao.com/user/invite/364502b6-fcc8-426a-81ba-79b42fdc8b11
{Javascript}
0/331
javascript获取屏幕/显示器分辨率，以及各种高宽的检测
糖不甩 / 2011 年 12 月 24 日最近在做项目（桌面壁纸相关的）需要用检测显示器分辨率，那么这次就利用javascript获取显示器分辨率，依然是原生JS，你懂得：） 提示：Javascript 获得分辨率以及各种高度宽度，在Firefox、IE、Chrome浏览器下结果不相同。 原理：屏幕分辨率是可靠的，用window.screen.height + ‘x’ + window.screen.width。 其他一些注意事项，小分享： 滚动条滚了多少，只有chrome知道。 网页高度是可靠的，用document.body.scrollHeight。 网页宽度不能用document.body.scrollWidth。 浏览器有多宽，IE6不知道，...
{Javascript}
0/348
js取随机数，JavaScript Math.random() 函数
糖不甩 / 2011 年 12 月 10 日.random-box dl{padding:5px 0;line-height:23px;float:none} .random-box dt{padding:0 0 5px 0;font-weight:bold;clear:both;border-bottom:1px solid #666;float:none} .random-box dd{padding:5px 0 0 0;margin:0;float:none} .random-box dd span{color:blue;} js随机数 JavaScript Math.random() 函数 Math.random() — 返回0和1之间的伪随机数 random，中文”随机的”的意思引用网址:http://www.cnblogs.com/ylemzhang/archive/2011/01/24/1943281.html random函数语法 Math.random() random函数...
{html5/css3}
0/257
Web2.0经典网站配色方案
糖不甩 / 2011 年 12 月 10 日Web2.0网站配色方案，这个配色真的很经典，做项目的时候总是会时不时用到，每次需要的时候总是在线搜，这次干脆收藏起来好了。 .case01{border:1px solid #96c2f1;background:#eff7ff} .case02{border:1px solid #9bdf70;background:#f0fbeb} .case03{border:1px solid #bbe1f1;background:#eefaff} .case04{border:1px solid #cceff5;background:#fafcfd} .case05{border:1px solid #ffcc00;background:#fffff7} .case06{border:1px solid #cee3e9;background:#f1f7f9} .case07{border:1px solid #a9c9e2;backgr...
{Flash/Flex}
0/312
Flash挡住浮动层挡住Div的解决方法
糖不甩 / 2011 年 12 月 9 日Flash挡住浮动层挡住Div的解决方法，超简单，在<object>添加如下两个方法之一即可。 方法一： <param name="wmode" value="opaque" /> 方法二： <param name="wmode" value="transparenst"> 这两种都行，糖不甩推荐方法一，因为对问题更有针对性。而且后者可能会降低动画性能。 以下是两种方法的对比：看大家喜好选择使用吧。 wmode 属性/参数值 Window | Opaque | Transparent 说明（可选）允许使用 Internet Explorer 4.0 中的透明 Flash 内容...
{Javascript}
1/300
原生js实现search搜索功能，全兼容。
糖不甩 / 2011 年 12 月 7 日原汁原味的js，实现search搜索功能，兼容所有浏览器。 主要用到2个方法： toLowerCase() 方法用于把字符串转换为小写。 search() 方法用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串。 实现原理： 1、将input的value和li的innerHTML转换为小写 2、后利用search()检索字符串进行匹配 3、将匹配的值push到空数组aTmp[]中 4、清空ul 5、将aTmp的新值创建到进ul里，最后利用onkeyUp执行函数 简简单单几行代码即可实现简易搜功能，在某些小项目中或许能轻松很多哦~ 如过有其他或者更好的实现方式...
{教程分享}
0/216
修改硬盘图标为任何图片
糖不甩 / 2011 年 11 月 23 日修改硬盘图标为任何图片 建议用autorun.inf文件的方法 在移动硬盘根目录下新建一个文本文档，里面写下： [autorun] icon=1.ico 然后保存，文件名改为autorun.inf。这里的1.ico就是你要改的图标，也要放在移动硬盘根目录下。这样你的硬盘在任何电脑上都能显示改过的图标。 ico图标文件，可以去网上下载，也可以下一个程序，比如picture to ico，可以把任何图片转换成ICO。
{html5/css3}
0/288
CSS3调用外部字体，@Font-Face的用法详解，全兼容。
糖不甩 / 2011 年 11 月 21 日CSS3调用外部字体，@Font-Face的用法详解，全兼容。 @Font-Face的用法详解 方法如下： @font-face { font-family: SketchRockwell; /*这里是说明调用来的字体名字*/ src: url('SketchRockwell.ttf'); /*这里是字体文件路径*/ } .my_CSS3_class { font-family: SketchRockwell; /*这里调用上面声明的字体值"SketchRockwell"*/ font-size: 3.2em; /*这里是字体大小*/ } 怕大家混淆，下面的是没有做注释的源文件: @font-face { font-family: SketchRockwell; src: url('SketchRockwell.ttf'); } .my_C...
{Javascript}
0/226
11个有用的移动网页开发App和HTML5框架
糖不甩 / 2011 年 11 月 21 日在过去的两年里，触屏设备飞速增长。iOS和Android设备让开发者和设计师开始重新思考他们的网页应用，以提供更好的触屏体验。 移动Web应用相对于本地的App有很多优势，虽然也有很多设计和开发上的挑战。这里列出了一系列有用的框架来帮助基于HTML的webapp开发。他们支持大部分流行的智能手机和平板。 1. Lungo.js：HTML5 移动开发框架 Lungo.js 是第一个应用HTML5和CSS3特性的移动开发框架。它可以帮助开发者创建iOS，Android，Blackberry和WebOS平台的应用。 Lungo.js 不需要任何web服务器的支持就能帮助用户实...
{Javascript}
0/303
js点击按钮控制上下滚动
糖不甩 / 2011 年 11 月 21 日javascript点击按钮控制上下滚动 .rgt_carlist{height:124px;overflow:hidden;} 1111111111 1111111111 2222222222 1111111111 2222222222 1111111111 2222222222 1111111111 2222222222 1111111111 2222222222 222222 function addLoadEvent(func){ var oldonload = window.onload; if(typeof window.onload!= 'function' ){ window.onload = func; } else{ window.onload = function(){ oldonload(); func(); } } } vscroll = function sglVscroll(){ if(!document.getElementById ...
{Javascript}
0/303
jQuery 显示隐藏更多文本
糖不甩 / 2011 年 11 月 21 日jQuery显示隐藏更多文本(Display More Text) texttexttexttexttexttexttexttexttexttexttexttext More↓ $(function(){ $(".content").each(function(){ var $targetEle = $(this).find("span").first(); var $btnCtrl = $(this).find("span").last(); var strAll = $targetEle.text(); if (strAll.length >30) { var sonStr = strAll.substr(0,30); $targetEle.text(sonStr) $btnCtrl.click(function(){ if ($btnCtrl.text().substr(0,5)=="More↓") { $target...
{html5/css3}
0/287
28个你必须知道的HTML5的新特性，技巧以及技术
糖不甩 / 2011 年 11 月 15 日原文：http://net.tutsplus.com/tutorials/html-css-techniques/25-html5-features-tips-and-techniques-you-must-know/ 总结一下： 1. 新的Doctype 尽管使用<!DOCTYPE html>，即使浏览器不懂这句话也会按照标准模式去渲染 2. Figure元素 用<figure>和<figcaption>来语义化地表示带标题的图片 <figure> <img src=”path/to/image” alt=”About image” /> <figcaption> <p>This is an image of something interesting. </p> </figcaption> </figure> 3....
{html5/css3}
1/369
HTML5实例网站资源，实例分享
糖不甩 / 2011 年 11 月 15 日JS APIs： 选择器 W3C草案：Selectors API Web Storage W3C草案：Web Storage 中文教程：Web Storage全解析： Web SQL Database W3C草案：Web SQL Database 中文教程：HTML 5 Web SQL Database初探 Application Cache API W3C草案：Offline Web applications 中文教程：离线Web应用-HTML5 Cache Manifest试验 Web Workers W3C草案：Web Workers 中文教程：開始HTML5 – Web Workers 中文教程：WEB Workers提升WEB前端脚本JavaScript的处理性能 Web Sockets W3C草案：Web Sockets 中文文章：在chrome中使...
{Javascript}
1/297
jQuery判断浏览器$.browser
糖不甩 / 2011 年 11 月 11 日用jQuery来判断浏览器的类型,主要是使用$.browser这个工具类(这个真的太有用，太好用了~~~) 使用方法: $.browser.['浏览器关键字'] $(function(){ if($.browser.msie) { alert("this is msie"); } else if($.browser.safari) { alert("this is safari!"); } else if($.browser.mozilla) { alert("this is mozilla!"); } else if($.browser.opera) { alert("this is opera"); } else { alert("other~"); } }); jQuery 使用的是通过正则来匹配userAgent判断浏览器的种类和版本. 如果我们要来判...
{html5/css3}
2/600