<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <title></title>

    <script src="../Scripts/jquery-1.4.1.js" type="text/javascript"></script>

    <script type="text/javascript">

        $(function () {

            $("#panel").toggle(function () {

                $(this).fadeOut();

            }, function () {

                $(this).fadeIn();

            });

        });

        $(function () {

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

                $("#panel").fadeIn();

            });

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

                $("#panel").fadeOut();

            });

            //***************************

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

                $("#div1").slideUp();

            });

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

                $("#div1").slideDown();

            });

        });

    </script>

</head>

<body>

    <div id="panel">

        sdfsldfjlksjalkfjdlsakjflksjadlfkjasldkjflksdaf</div>

    <input type="button" value="透明度显示" id="btnShow" />

    <input type="button" value="透明度隐藏" id="btnHide" />

    <br />

    <div id="div1">

        阿来的快放假了卡斯的减肥拉开斯蒂芬</div>

    <input type="button" value="垂直显示" id="btnSlideup" />

    <input type="button" value="垂直隐藏" id="btnslideDown" />

</body>

</html>

JQ动画，背景透明度的更多相关文章

  1. 问题杂烩(scrollTop/背景透明度动画)

    今天给同学找我帮忙写js,是公司里的活..我是不是应该跟他要钱哈哈,不过一顿饭肯定是免不了的了. 言归正传,今天写了三个小东西,因为兼容性的问题,用jq写的(很是别扭的说,但是没办法啊,一边看api一 ...

  2. android 背景透明度渐变动画

    button.setVisibility(View.VISIBLE); // 背景透明度渐变动画 ObjectAnimator alpha = ObjectAnimator.ofFloat(butto ...

  3. 日常css技巧小结（1）--背景透明度改变对内容无影响

    刚开始出现的错误,内容会受到背景透明度改变的影响:如图: 代码: <!DOCTYPE html> <html lang="en"> <head> ...

  4. 如何设置TextView控件的背景透明度和字体透明度

    如何设置TextView控件的背景透明度和字体透明度 设计师给的标注都是类似这样的: 字号:26 颜色:#000000 透明度:80% 其实,程序上只要需要一个色值就OK了,那么这个色值我如何计算呢? ...

  5. CSS 设置背景透明度，不影响子元素

    由于 opacity 属性能被子元素继承,使用它设置父元素背景透明度时也会影响子元素． 解决方法: 1> 使用 RGBA Example .classname { /* RGBa, 透明度0.6 ...

  6. 设置TextView控件的背景透明度和字体透明度

    TextView tv = (TextView) findViewById(R.id.xx); 第1种:tv.setBackgroundColor(Color.argb(255, 0, 255, 0) ...

  7. Android之使用参数改变ProgressDialog的位置、大小、背景透明度、屏幕透明度

    废话不多说,这个改变ProgressDialog的一些配置属性和前面我讲的AlertDialog的设置参数方法一模一样,这里就为了更直观,直接贴实现代码吧: ProgressDialog mProgr ...

  8. （21）jq动画

    jq动画的优点 优点: 1.可以知道动画结束的表示(结束的回调函数) 2.可以利用jq动画插件完成复杂的动画 动画有三个参数:动画的样式是字典.动画持续的事件,动画结束回调函数 <!DOCTYP ...

  9. scroll事件实现监控滚动条改变标题栏背景透明度(zepto.js )

    今天做了一个类似于手机端京东首页的页面,效果图如下: 刷新页面的时候,标题栏(也就是搜索栏),背景是透明的,当我们往下滑的时候,可以改变标题栏的背景透明度(渐变效果): 当标题栏滑过轮播图后,透明度就 ...

  10. css动画和jq动画的简单区分

    有很多不怎么用css3写动画的同学经常会对其中css3的transform,transition,translate,animation,@keyframes等等动画属性混淆错乱,经常使用了发现没有效 ...

随机推荐

  1. 关闭显卡快捷键 CTRL+ALT+方向键

    eclipse中的CTRL+ALT+方向键  会和电脑的快捷键进行冲突,按照以下的方法就可以解决了 打开控制面板,找到“显示”(图中圈划的),点击进入        找到”更改显示器设置“,点击进入 ...

  2. swift——设置navigationitemtitle的内容以及格颜色

    1.用UILabel,自定义整个titleview // var TitleText = UILabel() self.TitleText.frame = CGRectMake(0, 0, 100, ...

  3. 通过AJAX和PHP，提交JQuery Mobile表单

    File name: callajax.php <?php $firstName = $_POST[firstName]; $lastName = $_POST[lastName]; echo( ...

  4. POJ 1556 - The Doors 线段相交不含端点

    POJ 1556 - The Doors题意:    在 10x10 的空间里有很多垂直的墙,不能穿墙,问你从(0,5) 到 (10,5)的最短距离是多少.    分析:        要么直达,要么 ...

  5. 被sjy带刷题#1

        笔记[问题描述]给定一个长度为m的序列a,下标编号为1~m.序列的每个元素都是1~n的整数.定义序列的代价为 你现在可以选择两个数x和y,并将序列a中所有的x改成y.x可以与y相等.请求出序列 ...

  6. right way check file open and end

    check if a state is ok while(cin >> word) // ok: read successful condition states are constant ...

  7. （原）caffe中fine tuning及使用snapshot时的sh命令

    转载请注明出处: http://www.cnblogs.com/darkknightzh/p/5946041.html 参考网址: http://caffe.berkeleyvision.org/tu ...

  8. [ofbiz]less-than (&lt;) and greater-than (&gt;) symbols

    问题描述: In field [updateItemStr] less-than (<) and greater-than (>) symbols are not allowed 此处的f ...

  9. HTML5简单入门系列（四）

    前言 今天这篇内容主要讲述HTML 5 Web Worker(一种支持前端js多线程的技术). 工作线程(Web Worker) web worker介绍 W3C 在 HTML5 的规范中提出了工作线 ...

  10. 【2】开发环境的搭建，Ubuntu14.04

    这里使用的是Ubuntu14.04 Unity 更新源 首先,将更新源更换为国内更新源,我这里使用的是网易的更新源 sudo gedit /etc/apt/sources.list deb http: ...