网站左右折叠框：

<!DOCTYPE html>

<html>

<style>

#Kefclose,#Kefopen{position:absolute;left:-32px;top: %;display:block;width:32px;height: 100px;border-radius:15px   15px}

#Kefclose{background:url(../images/cclose.png) no-repeat center center #eee;background-size:20px;}

#Kefopen{background:url(../images/oopen.png) no-repeat center center #eee;background-size:20px;}

#Kefopen{display:none;}

</style>

<body>

<div id="online_qq_layer">

    <a href="javascript:;" id="Kefclose"></a>

    <a href="javascript:;" id="Kefopen"></a>

  </div>

<script>

    $(dunction(){

        $("#Kefclose").click(function () {

            $("#online_qq_layer").animate({

                marginRight:"-144px"

            }, "slow",function(){

                $("#Kefclose").hide();

                $("#Kefopen").show();

            });

        });

        $("#Kefopen").click(function () {

            $("#online_qq_layer").animate({

                marginRight:"-4px",

                display:"block"

            }, "slow", function () {

                $("#Kefopen").hide();

                $("#Kefclose").show();

            });

        });

    });

</script>

</body>

</html>

效果：

      

jquery左右折叠框的更多相关文章

  1. jquery复选框 选中事件 及其判断是否被选中

    jquery复选框 选中事件 及其判断是否被选中 (2014-07-25 14:03:54) 转载▼ 标签: jquery复选框选中事件 分类: extjs jquery   今天做了 显示和不显示密 ...

  2. js/jquery获取文本框的值与改变文本框的值

    我们就用它来学习获取文本框的值及改变文本框的值. 代码如下 复制代码 <script>function get1(){ document.getElementById("txtb ...

  3. jquery获取文本框的内容

    使用jquery获取文本框的内容有以下几种: 1.根据ID取值(id属性): // javascript <script type="text/javascript"> ...

  4. jQuery清除文本框，内容并设置不可用

    JQuery清除文本框,内容并设置不可用  如果是设置只读,则将disabled换成readonly function CleanText(textid) { $("#"+text ...

  5. jquery 展开折叠菜单

    jquery 展开折叠菜单 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <ht ...

  6. 用Jquery控制文本框只能输入数字和字母

    用Jquery控制文本框只能输入数字和字母 $.fn.onlyNum = function () { $(this).keypress(function (event) { var eventObj ...

  7. jquery实现密码框显示提示文字

    jquery实现密码框提示文字的功能. 代码:    <html>  <head>   3 <title>登录-jquery实现密码框显示文字-www.jbxue. ...

  8. jQuery EasyUI 提示框(Messager)用法

    jQuery EasyUI 提示框(Messager)不仅强大,而且也不用任何的HTML代码,只需要按照<jQuery EasyUI框架使用文档>包含必要文件后,在$(function() ...

  9. Unity编辑器-创建单独编辑框,折叠框,提示框

    今天我们就来学习如何创建一个编辑框,上面绘制一个折叠框里面有四种消息框. 代码如下: using UnityEngine; using System.Collections; using UnityE ...

随机推荐

  1. 运用 三种 原生 谷歌 阿里 解析和生成json

    三种类生成JSON数据方法 JSON(原生): 第一种 JSONStringer和JSONObject区别在于添加对象时是按顺序添加的比如说 JSONStringer 添加 a:1 b:2 c:3那么 ...

  2. (NO.00004)iOS实现打砖块游戏(十六):导弹发射道具的实现(下)

    大熊猫猪·侯佩原创或翻译作品.欢迎转载,转载请注明出处. 如果觉得写的不好请多提意见,如果觉得不错请多多支持点赞.谢谢! hopy ;) 上一篇我们完成了导弹道具相关的道具制作,本篇中我们来完成其实现 ...

  3. java 之容器

    在Java中,我们想要保存对象可以使用很多种手段.我们之前了解过的数组就是其中之一.但是数组具有固定的尺寸,而通常来说,程序总是在运行时根据条件来创建对象,我们无法预知将要创建对象的个数以及类型,所以 ...

  4. ElGamal密码

    ElGamal也是一种基于离散对数的公钥体制,与Diffie-Hellman密钥体制密切相关.ElGamal密码体系用于数字签名标准(DSS)和S/MIME电子邮件标准等一些技术标准中. 算法描述: ...

  5. linux 编译c程序与动态链接库

    linux 下编译c程序与动态链接库 1 动态库h文件和c文件 1.1 h 文件: kaflog4c.h /** * kaflog4c.h */ #include <stdio.h> #i ...

  6. Chapter 3 Protecting the Data（2）：分配列级权限

    原文出处:http://blog.csdn.net/dba_huangzj/article/details/39577861,专题目录:http://blog.csdn.net/dba_huangzj ...

  7. STL：list用法详解

    list容器介绍 相对于vector容器的连续线性空间,list是一个双向链表,它有一个重要性质:插入操作和删除操作都不会造成原有的list迭代器失效,每次插入或删除一个元素就配置或释放一个元素空间. ...

  8. ACM竞赛:立方和问题

    例如: 输入: n 代表多组数组 num1 , num 2 ep:  1    3 这时的算法结果应当为: 1 ^ 3 + 2 ^ 3 + 3 ^ 3 ep : 2    5 这时的算法结果应当为: ...

  9. 【python】使用unix管道pipe处理stdout实时数据

    现在有个实时抓包处理的程序,大概的流程是 使用tshark抓包->实时上传,如果写log的话是可以的,但是log文件切割需要定时执行. 由于log中有些内容需要实时处理,延迟时间会导致数据误差, ...

  10. JAVA集合类——难得的总结

    本文是在学习中的总结,欢迎转载但请注明出处:http://blog.csdn.net/pistolove/article/details/41346969 以下资料是在学习中总结出来的,希望对你有所帮 ...