兼容ie6，ie7，ie8，firefox，chrome浏览器的代码片段

hack实现方式和原理

#hacker{
    color:red; 
    *color:white; /*for ie6,ie7*/
    *+color:blue; /*for ie7*/
    _color:gray; /*for ie6*/
    color:balck !important; /*for firefox*/
    color:yellow 9; /*for ie9*/
}

透明 兼容所有浏览器

.transparent{
    filter:alpha(opacity=50);
   -moz-opacity:0.5;/**Firefox 3.5即将原生支持opacity
属性，所以本条属性只在Firefox3以下版本有效 ***/
   -khtml-opacity: 0.5; opacity: 0.5; 
}

渐变兼容所有浏览器

.gradient{
    filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#ffffff, EndColorStr=#dedede);
    background: -moz-linear-gradient(top, #ffffff, #dedede);
}

高亮兼容所有浏览器

.highlighted {
    background: none repeat scroll 0 0 #00ADEE;
    color: #FFFFFF;
    padding: 0 5px;
}

阴影兼容firefox

.shadow{    
    box-shadow: 0 5px 10px #cecece;;
}

圆角兼容firefox

.radius{    
    -webkit-border-radius: 4px;   /*只支持webkit内核的浏览器*/
    border-radius: 4px;  /*只支持IE内核的浏览器（IE>=7)*/
    -moz-border-radius : 4px; /*只支持Mozilla内核的浏览器*/
    border:#ddd solid 1px;
    padding:4px;
}

超出省略号展示兼容firefox，ie所有浏览器

.ellipsis{    
    white-space:nowrap;/*设置不折行*/
    text-overflow:ellipsis;/*这就是省略号喽*/
    -o-text-overflow:ellipsis;/*兼容opera*/
    width:80px;
    overflow:hidden;
}

旋转图片旋转效果，纯css实现，不兼容IE9以下浏览器

.rotate:hover{
     -o-transform: rotate(40deg); /* Opera浏览器 */
    -webkit-transform: rotate(40deg); /* Webkit内核浏览器 */
    -moz-transform: rotate(40deg); /* Firefox浏览器 */
    transform: rotate(360deg);
    transition: all 1s ease-out 0s;
}

首字母兼容所有浏览器

.firstletter:first-letter{
     font-size:120%;
}

去除链接虚线框兼容所有浏览器

<a href="link1.htm" onfocus="this.blur()">link</a>

纯css横向纵向居中兼容所有浏览器

<div style="960px; height:200px; background:red; position:absolute; left:50%; 
margin-left:-480px; top:50%; margin-top:-100px;"></div>

保存到桌面快捷方式一段php代码

<?php

$Shortcut = "[InternetShortcut]

URL=http://kuai.qietu.com

IDList=[{000214A0-0000-0000-C000-000000000046}]Prop3=19,2";

Header("Content-type: application/octet-stream");

header("Content-Disposition: attachment; filename=shortcut.url;");

echo $Shortcut;

?>

图标黑白变彩色快速实现整站黑白只要是符合w3标准的网页，在CSS文件的最前面加上一行代码就可以了，这段代码使用的是CSS滤镜，将网页中的色彩部分过滤掉。

html {     filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); } 
或者第二种方法在样式文件的最上端加上如下代码：以下是代码片段：
body{filter:Gray;} 
img{filter:Gray;}

flash 调用js最简单的方法方便flash工程师与js工程师的协调工作。

flash 调用js 最简单的方法是 :
getURL("javascript:function()"); //function 为此FLASH所在页面的JS函数名.

js 传递变量给 flash 最简单的方法是:
flash.setVariable("变量名","变量值"); //flash为此FLASH的id

网页将不能被另存为 <noscirpt>的用法很广，其中一条就是可以使JS广告失效。

<noscript><iframe src=*.html></iframe></noscript>

防止被人frame

<SCRIPT LANGUAGE=javascript><!-- 
　if (top.location != self.location)top.location=self.location; 
// --></SCRIPT>

永远都会带着框架这段代码是在表格提交时用到的。也就是在输入数据时不可以使用其他输入法模式。

<script language=javascript><!-- 
　if (window == top)top.location.href = frames.htm;// --></script>

关闭输入法

<input style="ime-mode:disabled"/>

防止复制

<body oncopy="return false"; oncut="return false";>

不准粘贴

<body onpaste="return false";>

取消选取、防止复制

<body onselectstart="return false";>

将彻底屏蔽鼠标右键,无右键菜单

<body oncontextmenu="return false";>
也可以用于网页中Table框架中
<table border oncontextmenu=return(false)><td>no</table>

弹出窗口

欢迎收藏哦。

普通的弹出窗口

window.open ('page.html') ;

经过设置后的弹出窗口

window.open ('page.html', 'newwindow', 'height=100, width=400, top=0, left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no');

弹启一个全屏窗口

window.open('http://kuai.qietu.com','example01','fullscreen');
window.open('index.asp','','fullscreen=1');

弹启一个被F11化后的窗口

window.open('http://kuai.qietu.com','example01','channelmode');

在弹出窗口中加上一个关闭按钮

onClick='window.close()';

弹启一个带有收藏链接工具栏的窗口

window.open('http://kuai.qietu.com','example03','width=400,height=300,directories');

ENTER键可以让光标移到下一个输入框

<input onKeyDown="if(event.keyCode==13)event.keyCode=9" >

IE地址栏前换成自己的图标

<link rel="ShortcutIcon" href="favicon.ico">

可以在收藏夹中显示出你的图标

<link rel="Bookmark" href="favicon.ico">

自动跳转 content=3 表示3秒刷新到URL

<meta http-equiv="refresh" content="3; URL=http://www.baidu.com" charset="gb2312"/>

IE自带的网页过渡特效

<meta  http-equiv="Page-Enter"  content="blendTrans(Duration=1.0)">
混合  
<meta  http-equiv="Page-Enter"  content="revealTrans(Duration=1.0,Transition=0)">
盒状收缩  
<meta  http-equiv="Page-Enter"  content="revealTrans(Duration=1.0,Transition=1)">
盒状展开  
<meta  http-equiv="Page-Enter"  content="revealTrans(Duration=1.0,Transition=2)">
圆形收缩  
<meta  http-equiv="Page-Enter"  content="revealTrans(Duration=1.0,Transition=3)">
圆形放射  
<meta  http-equiv="Page-Enter"  content="revealTrans(Duration=1.0,Transition=4)">
向上擦除  
<meta  http-equiv="Page-Enter"  content="revealTrans(Duration=1.0,Transition=5)">
向下擦除  
<meta  http-equiv="Page-Enter"  content="revealTrans(Duration=1.0,Transition=6)">
向右擦除  
<meta  http-equiv="Page-Enter"  content="revealTrans(Duration=1.0,Transition=7)">
向左擦除  
<meta  http-equiv="Page-Enter"  content="revealTrans(Duration=1.0,Transition=8)">
垂直遮蔽  
<meta  http-equiv="Page-Enter"  content="revealTrans(Duration=1.0,Transition=9)">
水平遮蔽  
<meta  http-equiv="Page-Enter"  content="revealTrans(Duration=1.0,Transition=10)">
横向棋盘式  
<meta  http-equiv="Page-Enter"  content="revealTrans(Duration=1.0,Transition=11)">
纵向棋盘式  
<meta  http-equiv="Page-Enter"  content="revealTrans(Duration=1.0,Transition=12)">
随机溶解  
<meta  http-equiv="Page-Enter"  content="revealTrans(Duration=1.0,Transition=13)"> 
左右向中央缩进  
<meta  http-equiv="Page-Enter"  content="revealTrans(Duration=1.0,Transition=14)">
中央向左右扩展  
<meta  http-equiv="Page-Enter"  content="revealTrans(Duration=1.0,Transition=15)"> 
上下向中央缩进  
<meta  http-equiv="Page-Enter"  content="revealTrans(Duration=1.0,Transition=16)">
中央向上下扩展  
<meta  http-equiv="Page-Enter"  content="revealTrans(Duration=1.0,Transition=17)">
从左下抽出  
<meta  http-equiv="Page-Enter"  content="revealTrans(Duration=1.0,Transition=18)">
从左上抽出  
<meta  http-equiv="Page-Enter"  content="revealTrans(Duration=1.0,Transition=19)">
从右下抽出  
<meta  http-equiv="Page-Enter"  content="revealTrans(Duration=1.0,Transition=20)">
从右上抽出  
<meta  http-equiv="Page-Enter"  content="revealTrans(Duration=1.0,Transition=21)">
随机水平线条  
<meta  http-equiv="Page-Enter"  content="revealTrans(Duration=1.0,Transition=22)">
随机垂直线条  
<meta  http-equiv="Page-Enter"  content="revealTrans(Duration=1.0,Transition=23)">
随机

网页不会被缓存

<meta http-equiv = "pragma" content="no-cache">
<meta http-equiv = "Cache-Contro" content="no-cache, must-revalidate">
<meta http-equiv = "expires" content="Wed, 26 Feb 1997 08:21:57 GMT">
<meta http-equiv="expires"  content="0">

满屏的遮罩纯css实现史上最简单代码，兼容所有浏览器

/*纯css全屏的遮罩层*/
#overlay{ 
    display: none; 
    position: absolute; 
    top: 0%; 
    left: 0%; 
    width: 100%; 
    height: 100%; 
    background-color: black; 
    z-index:1001; 
    -moz-opacity: 0.8; 
    opacity:.80; 
    filter: alpha(opacity=80); 
}

不错的JS模拟下拉菜单

来自日常工作中的整理，使用频率比较高的一个代码范例。 遇到的时候不太好找，所以要收藏哦。
演示
1987
请选择性别↓
初中
代码

var ____configArray;
function __initDropDownList(configArray){
    //获取Select菜单
    ____configArray=configArray;
    var existArray=configArray.split("|");
    for(var i=0;i<existArray.length;i++){
        if(existArray[i].length<1){return;}
        //根据参数分别获取div，并分别添加事件
        var parentContainer=document.getElementById(existArray[i]);
        if(!parentContainer){return;}
        //获取下面的select，且获取其中的option
        var selectObj=parentContainer.getElementsByTagName("select");
        if(selectObj.length<1){return;}
        var optionArray=selectObj[0].getElementsByTagName("option");
        //获取option，并分别添加到各个li
        var optionLength=optionArray.length;
        for(var j=0;j<optionLength;j++){
            //获取ul，以便能够添加项目
            var ulObj=parentContainer.getElementsByTagName("ul");
            if(ulObj.length<1){return;}
            //获取span，以便能显示当前选择的项目
            var spanObj=parentContainer.getElementsByTagName("span");
            if(spanObj.length<1){return;}
            var liObj=document.createElement("li");
            var textNode=document.createTextNode(optionArray[j].firstChild.nodeValue)
            liObj.appendChild(textNode);
            liObj.setAttribute("currentIndex",j);
            //给每个liObj添加事件
            liObj.onclick=function(){
                selectCurrentItem(this.parentNode,this);
            }
            liObj.onmouseover=function(){this.className="over";}
            liObj.onmouseout=function(){this.className="";}
            ulObj[0].appendChild(liObj);
            spanObj[0].onclick=function(event){
                //如果当前是显示的，就隐藏，反之亦然
                showHiddenUl(this);
            }
            spanObj[0].onmouseover=function(){this.className='over';}
            spanObj[0].onmouseout=function(){this.className="";};
            ulObj[0].onclick=function(){this.className="";}
        }
        parentContainer.onclick=function(event){
            if(!event){event=window.event;}
                //阻止事件冒泡
                event.cancelBubble=true;
                var eventUlObj=this.getElementsByTagName("ul")[0];
                bodyClickHiddenUl(eventUlObj);
        }
    }
}
function selectCurrentItem(ulObj,currentObj){
    var parentObj=ulObj.parentNode;
    var spanObj=parentObj.getElementsByTagName("span")[0];
    spanObj.firstChild.nodeValue=currentObj.firstChild.nodeValue;
    var selectObj=parentObj.getElementsByTagName("select")[0];
    selectObj.selectedIndex=parseInt(currentObj.getAttribute("currentIndex"));
}
function showHiddenUl(currentObj){
    var parentNode=currentObj.parentNode;
    var ulObj=parentNode.getElementsByTagName("ul")[0];
    if(ulObj.className==""){
        ulObj.className="show";
    }else{
        ulObj.className="";
    }
}
//点击body区域（非“下拉菜单”）隐藏菜单
function addBodyClick(func) {
    var bodyObj=document.getElementsByTagName("body")[0];
    var oldBodyClick = bodyObj.onclick;
        if (typeof bodyObj.onclick != 'function') {
            bodyObj.onclick = func;
        } else {
            bodyObj.onclick = function() {
            oldBodyClick();
            func();
        }
    }
}
//隐藏所有的UL
function bodyClickHiddenUl(eventUlObj){
    var existArray=____configArray.split("|");
    for(var i=0;i<existArray.length;i++){
        if(existArray[i].length<1){return;}
        //寻找所有UL并且隐藏
        var parentContainer=document.getElementById(existArray[i]);
        if(!parentContainer){return;}
        var ulObj=parentContainer.getElementsByTagName("ul");
        if(eventUlObj!=ulObj[0]){
            ulObj[0].className="";
        }
    }
}
var __dropDownList="dropDownList1|dropDownList2|dropDownList3";
__initDropDownList(__dropDownList);
//添加这个可以确保点击body区域的时候也可以隐藏菜单
addBodyClick(bodyClickHiddenUl);

View Code

JS拖动层特效基于javascript，务必将代码放到html后面，适合二次开发，拖动层必须在标签内写上style样式，并且有top和left属性、绝对定位

var posX;
var posY;       
fdiv = document.getElementById("元素ID");           
document.getElementById("元素ID").onmousedown=function(e)
{
    if(!e) e = window.event;  //IE
    posX = e.clientX - parseInt(fdiv.style.left);
    posY = e.clientY - parseInt(fdiv.style.top);
    document.onmousemove = mousemove;           
}
document.onmouseup = function()
{
    document.onmousemove = null;
}
function mousemove(ev)
{
    if(ev==null) ev = window.event;//IE
    fdiv.style.left = (ev.clientX - posX) + "px";
    fdiv.style.top = (ev.clientY - posY) + "px";
}

客服漂浮效果特效基于javascript，务必将代码放到html后面，适合二次开发，拖动层必须在标签内写上style样式，并且有top和left属性、绝对定位

var _customer = document.getElementById('customer');
_customer.style.display = 'block';
function position(){
    _customer.style.top = '250px';
}

lastScrollY=0;
function heartBeat(){
var diffY;
if (document.documentElement && document.documentElement.scrollTop)
 diffY = document.documentElement.scrollTop;
else if (document.body)
 diffY = document.body.scrollTop
else
 {/*Netscape stuff*/}

//alert(diffY);
percent=.1*(diffY-lastScrollY);
if(percent>0)percent=Math.ceil(percent);
else percent=Math.floor(percent);
_customer.style.top=parseInt(_customer.style.top)+percent+"px";

lastScrollY=lastScrollY+percent;
//alert(lastScrollY);
}
window.setInterval("heartBeat()",50);

View Code

缩放图片等比例缩放特效基于javascript，务必将代码放到html后面，适合二次开发

方法一 
//e = document.getElementById("tester");
var images = document.images;
for(i=0; i<images.length; i++){
    var img = images[i];
    if (images[i].width > 50){
       images[i].width = 50;
    }
}

View Code

方法二
//缩放图片到合适大小
function ResizeImages()
{
   var myimg,oldwidth,oldheight;
   var maxwidth=100;
   var maxheight=100
   var imgs = document.getElementById('zoomer').getElementsByTagName('img');   //如果你定义的id不是zoomer，请修改此处  。先获取到所有图片

   for(i=0;i<imgs.length;i++){
     myimg = imgs[i];

     if(myimg.width > myimg.height)
     {
         if(myimg.width > maxwidth)
         {
            oldwidth = myimg.width;
            myimg.height = myimg.height * (maxwidth/oldwidth);
            myimg.width = maxwidth;
         }
     }else{

         if(myimg.height > maxheight)
         {
            oldheight = myimg.height;
            myimg.width = myimg.width * (maxheight/oldheight);
            myimg.height = maxheight;
         }
     }
   }
}
//缩放图片到合适大小
ResizeImages();

View Code

tooltip 纯css制作三角兼容所有浏览器

.arrow{ width:0; height:0;
        border-top:0px;
        border-bottom:9px solid #1c7ecf;
        border-right:9px solid #fff;
        border-left:9px solid #fff;    
}

对联广告演示了一个两侧漂浮广告的效果，简洁的代码。兼容所有浏览器。

//用JS写入图片

    var delta=0.08
    var collection;
    function floaters() {
        this.items    = [];
        this.addItem    = function(id,x,y,content)
                  {
                    document.write('<DIV id='+id+' style="Z-INDEX: 10; POSITION: absolute;  80px; height:60px;left:'+(typeof(x)=='string'?eval(x):x)+';top:'+(typeof(y)=='string'?eval(y):y)+'">'+content+'</DIV>');
                    
                    var newItem                = {};
                    newItem.object            = document.getElementById(id);
                    newItem.x                = x;
                    newItem.y                = y;

                    this.items[this.items.length]        = newItem;
                  }
        this.play    = function()
                  {
                    collection                = this.items
                    setInterval('play()',10);
                  }
        }
        function play()
        {

            for(var i=0;i<collection.length;i++)
            {
                var followObj        = collection[i].object;
                var followObj_x        = (typeof(collection[i].x)=='string'?eval(collection[i].x):collection[i].x);
                var followObj_y        = (typeof(collection[i].y)=='string'?eval(collection[i].y):collection[i].y);

                if(followObj.offsetLeft!=(document.body.scrollLeft+followObj_x)) {
                    var dx=(document.body.scrollLeft+followObj_x-followObj.offsetLeft)*delta;
                    dx=(dx>0?1:-1)*Math.ceil(Math.abs(dx));
                    followObj.style.left=followObj.offsetLeft+dx;
                    }

                if(followObj.offsetTop!=(document.body.scrollTop+followObj_y)) {
                    var dy=(document.body.scrollTop+followObj_y-followObj.offsetTop)*delta;
                    dy=(dy>0?1:-1)*Math.ceil(Math.abs(dy));
                    followObj.style.top=followObj.offsetTop+dy;
                    }
                followObj.style.display    = '';
            }
        }    
        
    var theFloaters        = new floaters();
    //右面
    theFloaters.addItem('coupleter1','document.body.clientWidth-106',80,'<a href="###" target=_blank><img src="#"  width="100" height="300" border=0></a>');
    //左面
    theFloaters.addItem('coupleter2',6,80,'<a href=http://www.lanrentuku.com/ target=_blank><img src="#" width="100" height="300" border=0></a>');
    theFloaters.play();
    
//图片格式调用方法
//<EMBED src=images/duilian.swf quality=high  WIDTH=100 HEIGHT=300 TYPE=application/x-shockwave-flash id=ad wmode=opaque></EMBED>

View Code

复选框全选/取消全选后单元格变色

<form name="form1" method="post">
    <input name="id[]" type="checkbox">AAA<br/>
    <input name="id[]" type="checkbox">BBB<br/>
    <input name="id[]" type="checkbox">CCC<br/>
    <input name="id[]" type="checkbox">DDD<br/>
    <input type="checkbox" name="chkAll" title="" onclick="selectAll();">全选/取消    
</form>
    <script type="text/javascript">

            //复选
            function selectAll(){  
                var chk = document.form1.chkAll.checked;
                for (i=0;i<document.all.length;i++){
                    if (document.all[i].name=="id[]"){
                        document.all[i].checked=chk;
                        chkRow(document.all[i]);
                    }
                }
            }
            //复选后单元格变色
            function chkRow(obj){
                var r = obj.parentElement.parentElement;
                //alert(r.nodeName);  //body

                if(obj.checked){ 
                    r.style.backgroundColor="#E6E9F2";
                }
                else{
                    if(r.rowIndex%2==1)r.style.backgroundColor="";
                    else r.style.backgroundColor="#F5F5F5";
                }
            }
    </script>

View Code

jquery图片滚动左右可控制图片滚动,图片自动滚动

   <!--滚动代码区域-->
<div class="roll">
    <div class="left">&lt;</div>
    <div class="inner">
          <ul style="margin-left: 0px;">
             <li>
                 <font class="danley">Quickcss</font>
             </li>
             <li>
                 <font class="danley">Quickcss</font>
             </li>
             <li>
                 <font class="danley">Quickcss</font>
             </li>
         </ul>
    </div>
    <div class="right">&gt;</div>
    <div class="status">
        <a href="#" class="">a</a>
        <a href="#" class="selected">a</a>
        <a href="#" class="">a</a>
    </div>
</div>
<!--滚动代码区域-->
<script type="text/javascript">
     /** 版权所有: 快切
     * 网站地址: http://code.google.com/p/quickcss/*/
    
    $(function(){
        
        // 添加Jquery扩展的写法
        $.extend({
            autoChange:function(){
                $('.roll ul').animate({'marginLeft':-100},function(){
                    $(this).css('marginLeft',0).find('li:first').appendTo($(this));
                    
                    // 状态按钮的切换
                    if($('.roll .status a.selected').next().size()==0){
                        $('.roll .status a.selected').removeClass('selected').parent().find('a:first').addClass('selected');
                    }
                    else{
                        $('.roll .status a.selected').removeClass('selected').next().addClass('selected');
                    }
                });
            }
        })
        // 函数重复调用，基于jQuery的方法一定要以上面的写法定义，否则这里不会生效
        _interval = setInterval("$.autoChange()",3000);
        
        /*鼠标移上去滚动停止,鼠标拿开继续滚动*/
        $('.roll').mouseover(function(){
            clearInterval(_interval);
        })
        $('.roll').mouseout(function(){
            _interval = setInterval("$.autoChange()",3000);                     
        })

        
        $('.roll .left').click(function(){
            
            // 将整个ul设置动画方式负移位，制造图片左移的效果，然后设置移位为0，将第一张图片获取补到最后，到这里整个图片左移效果完成
            $('.roll ul').animate({'marginLeft':-100},function(){
                $(this).css('marginLeft',0).find('li:first').appendTo($(this));
                
                // 状态按钮的切换
                    if($('.roll .status a.selected').next().size()==0){
                        $('.roll .status a.selected').removeClass('selected').parent().find('a:first').addClass('selected');
                    }
                    else{
                        $('.roll .status a.selected').removeClass('selected').next().addClass('selected');
                    }
            });
        },
        function(){});
        
        $('.roll .right').click(function(){
        
            // 同上
            $('.roll ul').css('marginLeft',-100).find('li:last').prependTo($('.roll ul'));
            $('.roll ul').animate({'marginLeft':0});
            
            // 状态按钮的切换
                    if($('.roll .status a.selected').next().size()==0){
                        $('.roll .status a.selected').removeClass('selected').parent().find('a:first').addClass('selected');
                    }
                    else{
                        $('.roll .status a.selected').removeClass('selected').next().addClass('selected');
                    }
        },
        function(){})
    })

    </script>

View Code

兼容ie6，ie7，ie8，firefox，chrome浏览器的代码片段

hack实现方式和原理

渐变 兼容所有浏览器

高亮 兼容所有浏览器

阴影 兼容firefox

圆角 兼容firefox

超出省略号展示 兼容firefox，ie所有浏览器

旋转 图片旋转效果，纯css实现，不兼容IE9以下浏览器

首字母 兼容所有浏览器

去除链接虚线框 兼容所有浏览器

纯css横向纵向居中 兼容所有浏览器

保存到桌面快捷方式 一段php代码

图标黑白变彩色 快速实现整站黑白 只要是符合w3标准的网页，在CSS文件的最前面加上一行代码就可以了，这段代码使用的是CSS滤镜，将网页中的色彩部分过滤掉。

flash 调用js最简单的方法 方便flash工程师与js工程师的协调工作。

网页将不能被另存为 <noscirpt>的用法很广，其中一条就是可以使JS广告失效。

防止被人frame

永远都会带着框架 这段代码是在表格提交时用到的。也就是在输入数据时不可以使用其他输入法模式。

关闭输入法

防止复制

不准粘贴

取消选取、防止复制

将彻底屏蔽鼠标右键,无右键菜单

弹出窗口

ENTER键可以让光标移到下一个输入框

IE地址栏前换成自己的图标

可以在收藏夹中显示出你的图标

自动跳转 content=3 表示3秒刷新到URL

IE自带的网页过渡特效

网页不会被缓存

满屏的遮罩纯css实现 史上最简单代码，兼容所有浏览器

不错的JS模拟下拉菜单

JS拖动层 特效基于javascript，务必将代码放到html后面，适合二次开发，拖动层必须在标签内写上style样式，并且有top和left属性、绝对定位

客服漂浮效果 特效基于javascript，务必将代码放到html后面，适合二次开发，拖动层必须在标签内写上style样式，并且有top和left属性、绝对定位

缩放图片 等比例缩放 特效基于javascript，务必将代码放到html后面，适合二次开发

tooltip 纯css制作三角兼容所有浏览器

对联广告 演示了一个两侧漂浮广告的效果，简洁的代码。兼容所有浏览器。

复选框 全选/取消 全选后单元格变色

jquery图片滚动 左右可控制图片滚动,图片自动滚动

渐变兼容所有浏览器

高亮兼容所有浏览器

阴影兼容firefox

圆角兼容firefox

超出省略号展示兼容firefox，ie所有浏览器

旋转图片旋转效果，纯css实现，不兼容IE9以下浏览器

首字母兼容所有浏览器

去除链接虚线框兼容所有浏览器

纯css横向纵向居中兼容所有浏览器

保存到桌面快捷方式一段php代码

图标黑白变彩色快速实现整站黑白只要是符合w3标准的网页，在CSS文件的最前面加上一行代码就可以了，这段代码使用的是CSS滤镜，将网页中的色彩部分过滤掉。

flash 调用js最简单的方法方便flash工程师与js工程师的协调工作。

永远都会带着框架这段代码是在表格提交时用到的。也就是在输入数据时不可以使用其他输入法模式。

满屏的遮罩纯css实现史上最简单代码，兼容所有浏览器

JS拖动层特效基于javascript，务必将代码放到html后面，适合二次开发，拖动层必须在标签内写上style样式，并且有top和left属性、绝对定位

客服漂浮效果特效基于javascript，务必将代码放到html后面，适合二次开发，拖动层必须在标签内写上style样式，并且有top和left属性、绝对定位

缩放图片等比例缩放特效基于javascript，务必将代码放到html后面，适合二次开发

对联广告演示了一个两侧漂浮广告的效果，简洁的代码。兼容所有浏览器。

复选框全选/取消全选后单元格变色

jquery图片滚动左右可控制图片滚动,图片自动滚动