网站左右折叠框：

<!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. linu下C语言之BMP图片操作编程(下)

    前面提高了一个将BMP左转的程序,右转其实也是类似的操作,就不写了,这节,我们来实现,将一张BMP图进行灰度处理,代码贴上: #include <stdio.h> #include < ...

  2. iOS 南京互联网大会分享及个人见解 韩俊强的博客

    首先分两大块: 1.如何打造高效/稳定的App (重点): 2.软件自动化测试: 每日更新关注:http://weibo.com/hanjunqiang  新浪微博! 每日更新关注:http://we ...

  3. 带吸附效果的ViewPager（二）

    上篇实现了一个简单的吸附效果,那么这篇我们来实现上篇中所示的360软件详情页(带viewpager)的效果!先来参观下本篇所实现的效果图: 了解了上一篇的实现过程,那么本篇的效果无非是修改一下布局,将 ...

  4. C++为什么要设计友元函数和友元类

    1. 首先要提一下java,比如java定义一个类1.class,会生成字节码.java有反射机制,可以找到类对象,直接修改类的私有属性.逐渐反射机制成为了一种标准,sun做成标准,JDK的API函数 ...

  5. ROS(indigo)_turtlebot仿真示例包括stage和gazebo

    ROS(indigo)_turtlebot仿真示例包括stage和gazebo 现上参考网址: turtlebot:http://wiki.ros.org/Robots/TurtleBot stage ...

  6. (NO.00003)iOS游戏简单的机器人投射游戏成形记(七)

    因为到目前为止我都是在iOS模拟器中测试,但即便如此,也觉得按住手臂旋转时,手臂转动起来比较费劲,很难停止在玩家期望的位置上.因为手臂完全通过物理引擎的计算来移动,它有自身的惯性影响,所以很难控制. ...

  7. Leetcode_7_Reverse Integer

    本文是在学习中的总结,欢迎转载但请注明出处:http://blog.csdn.net/pistolove/article/details/41578077 Reverse Integer Revers ...

  8. Leetcode_26_Remove Duplicates from Sorted Array

    本文是在学习中的总结,欢迎转载但请注明出处:http://blog.csdn.net/pistolove/article/details/41558551 Remove Duplicates from ...

  9. wing带你玩转自定义view系列（1） 仿360内存清理效果

    本篇是接自 手把手带你做自定义view系列 宗旨都是一样,带大家一起来研究自定义view的实现,与其不同的是本系列省去了简单的坐标之类的讲解,重点在实现思路,用简洁明了的文章,来与大家一同一步步学习. ...

  10. java缓存系统

    第一版 package cache; import java.util.HashMap; import java.util.Map; public class Cache1 { private Map ...