网站左右折叠框:

<!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. Dynamics CRM2015 The plug-in type does not exist in the specified assembly问题的解决方法

    在用插件工具PluginProfiler调试时,报"The plug-in type  xxxx  does not exist in the specified assembly" ...

  2. Android文本框-android学习之旅(十七 )

    文本框简介 文本框属于基本的andoid控件,TextView继承了View是最基本的文本框,它的子类包括EditView和Button等,TextView的大部分方法,它的子类也可以使用. Text ...

  3. 【一天一道LeetCode】#172. Factorial Trailing Zeroes

    一天一道LeetCode 本系列文章已全部上传至我的github,地址:ZeeCoder's Github 欢迎大家关注我的新浪微博,我的新浪微博 欢迎转载,转载请注明出处 (一)题目 Given a ...

  4. 安卓java.lang.IllegalArgumentException: The observer is null.解决方案

    刚刚在调试自己的APP项目的时候报错java.lang.IllegalArgumentException: The observer is null.,而之前是可以运行通过,所以百思不得其解,后来在网 ...

  5. window.open 打开子窗口,关闭所有的子窗口

    需求:通过window.open方法打开了子窗口,当关闭主窗口时,子窗口应当也关闭. 实现思路: 1.打开子窗口函数window.open(url,winName)的第二个参数winName可以唯一标 ...

  6. (NO.00004)iOS实现打砖块游戏(九):游戏中小球与反弹棒的碰撞

    大熊猫猪·侯佩原创或翻译作品.欢迎转载,转载请注明出处. 如果觉得写的不好请告诉我,如果觉得不错请多多支持点赞.谢谢! hopy ;) 前一篇博文介绍了物理对象中小球与砖块的碰撞处理,在这一篇中我们再 ...

  7. UNIX环境高级编程——主线程与子线程的退出关系

    我们在一个线程中经常会创建另外的新线程,如果主线程退出,会不会影响它所创建的新线程呢?下面就来讨论一下. 1.  主线程等待新线程先结束退出,主线程后退出.正常执行. 示例代码: #include & ...

  8. 【一天一道LeetCode】#99. Recover Binary Search Tree

    一天一道LeetCode 本系列文章已全部上传至我的github,地址:ZeeCoder's Github 欢迎大家关注我的新浪微博,我的新浪微博 欢迎转载,转载请注明出处 (一)题目 Two ele ...

  9. 版本控制之最佳实践(Git版)

    现如今,应该每个开发者都在使用版本控制工具了吧.然而,如果你理解版本控制的基本规则,你便能更好地发挥它的效用.在此,我们汇总了一些最佳实践,希望你在使用Git做版本控制时能够了然于心.得心应手. 1. ...

  10. C语言之统计输入字符数量

    这个程序市委了统计所输入的数字或者英文字母的数字的数量,当然稍加改动便可以统计特殊字符的个数,在此不再冗叙. 代码如下: #include <iostream> using namespa ...